Menu
Feedback
Comece aqui
Tutoriais
Portal do desenvolvedor

Problemas conhecidos
Diretivas de suporte
Troubleshooting

Perguntas frequentes
Comunicados
Tutoriais
Tutoriais
Explore tutoriais detalhados para operar sua loja VTEX.
Tutoriais
Storefront
Layout
Personalizar uma página usando placeholder
Personalizar uma página usando placeholder

Criar uma descrição para Categoria pode influenciar positivamente no SEO do site. É muito interessante manter o site como um todo bem mapeado para aumentar a relevância dos termos citados em textos como descrição, footer, menu, etc.

Colocando a descrição no site

Para incluir uma descrição no site, siga os passos abaixo:

  1. Entre em CMS > Layout
  2. Entre em Templates de Página
  3. Clique em Categoria
  4. No XHTML do Template, insira o código contendo o placeholder, como no exemplo abaixo
  5. Clique em Salvar Template

Exemplo de código


html
<div class="bloco-de-conteudo"/>
<vtex:contentPlaceHolder id="htmlSeo"/>
</div>

Lembrando que o htmlSeo é o nome do controle criado lá em cima. Este controle pode ter outro nome, como por exemplo Banner-Principal.

Exemplos

{"base64":"  ","img":{"width":1071,"height":305,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":18178,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-personalizar-uma-pagina-usando-placeholder_1.png"}}

{"base64":"  ","img":{"width":1118,"height":258,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":14638,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-personalizar-uma-pagina-usando-placeholder_2.png"}}

Obs.: A aplicação do placeholder pode ser realizada de outras maneiras até que atenda o local, o formato, ou seja, a necessidade do lojista.

Criando a descrição

Para incluir uma descrição para Categoria, siga os passos abaixo:

  1. Entre em Configurações > Portal
  2. Clique em Portal > Web-sites > [nomedaloja] > / > categoria > @categoria@ > categoria
    {"base64":"  ","img":{"width":276,"height":561,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":42523,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-personalizar-uma-pagina-usando-placeholder_3.png"}}
  3. Entre na aba Configurações
    {"base64":"  ","img":{"width":1010,"height":482,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":21503,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-personalizar-uma-pagina-usando-placeholder_4.png"}}
  4. Clique em Adicionar Controle
  5. Selecione o tipo de controle que deseja, geralmente HTML
    {"base64":"  ","img":{"width":547,"height":317,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":17205,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-personalizar-uma-pagina-usando-placeholder_5.png"}}
  6. Clique em Adicionar
  7. Clique em Salvar Configurações
  8. Clique em Editar
  9. Clique em Adicionar Conteúdo
    {"base64":"  ","img":{"width":1084,"height":243,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":19485,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-personalizar-uma-pagina-usando-placeholder_6.png"}}
  10. Crie o HTML que gostaria que aparecesse no site
  11. Na aba Preview poderá ter uma pré-visualização do HTML
  12. Nos campos Condições de Exibição, configure de acordo com sua necessidade, por exemplo, selecione uma Categoria, onde este conteúdo será disponibilizado.
  13. Clique no checkbox Conteúdo Ativo
  14. Clique em Adicionar na Lista de Conteúdo
    {"base64":"  ","img":{"width":768,"height":588,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":98713,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/pt/tutorials/Storefront/Layout/como-personalizar-uma-pagina-usando-placeholder_7.png"}}
  15. Clique em Salvar Configurações
Contribuidores
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
Isso foi útil?
Sim
Não
Sugerir edições (GitHub)
Contribuidores
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
Nesta página
Ainda tem dúvidas?
Pergunte à comunidade
Encontre soluções e compartilhe ideias na comunidade VTEX.
Junte-se à nossa comunidade
Solicite suporte à VTEX
Para assistência personalizada, entre em contato com nossos especialistas.
Abra um ticket de suporte
GithubDeveloper portalComunidadeFeedback