{"section":"tutorials","requestedLocale":"pt","requestedSlug":"gerenciandoplaceholders","locale":"pt","slug":"gerenciandoplaceholders","path":"docs/pt/tutorials/storefront/layout/gerenciandoplaceholders.md","branch":"main","content":"Os placeholders permitem à loja inserir quatro tipos de elementos na página:\n- Banner\n- Banner DHTML\n- Coleção\n- HTML\n\nNa prática, um placeholder é um trecho de código configurável, que atende a condições definidas pela loja.\n\nPor exemplo, você pode inserir um placeholder na homepage e defini-lo como um banner; e então escolher três imagens diferentes para esse banner, cada uma ativada em uma faixa de datas específica.\n\n### Inserindo o placeholder no template\n\nAntes de mais nada, para criar um novo placeholder, é preciso inserir o controle que vai defini-lo no template.\n\nEste é o controle de placeholders: `<vtex:contentPlaceHolder id=\"\" />`\n\nO que ele faz é criar um elemento configurável no local do código onde for inserido.\n\nÉ importante inserir um valor de `id`. Este será o identificador desse placeholder no sistema.\n\n![6 1](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/storefront/layout/gerenciandoplaceholders_1.png)\n\n### Configurando o placeholder\n\nAgora que o controle de placeholder foi inserido no template, vamos configurá-lo.\n\nIsso é feito nas configurações do layout que usa esse template.\n\n1. Abra o layout e depois clique na aba **Settings**. O novo placeholder deve aparecer aí, com o nome igual ao valor do id definido no controle. Por enquanto, esse placeholder está vazio, ou seja, não há nenhum objeto dentro dele.![6 2](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/storefront/layout/gerenciandoplaceholders_2.png)\n2. Para inserir um objeto, clique em **add object**. \n3. Em seguida, escolha o tipo de objeto e clique em **Adicionar**.\n4. Por fim, clique no botão **Save Settings**, no alto da página.\n\nAgora você já pode editar o objeto inserido no placeholder.\n\nPara isso, clique no lápis dentro do objeto e, em seguida, clique em **add content**.\n\n![6 3](https://cdn.statically.io/gh/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/storefront/layout/gerenciandoplaceholders_3.png)\n\nAgora você pode definir o nome desse objeto, subir imagens para ele e configurar as condições em que ele vai ser renderizado, tais como o período. \n\nAo final, clique em __Add Content List__ e depois salve o conteúdo."}