Passar para o conteúdo principal

Configuração de Vitrines e Conteúdo no Painel Administrativo da VTEX

b
Escrito por bruno bulso

Esse componente que permite a configuração de vitrines (Carrossel de Produtos) e Banner Código de Cupom, Lista de Produtos para que sejam exibidos em outras páginas do app como PDP,PLP, Carrinho.

Configurando Contêiner de Vitrines

  1. Realize o login no painel administrativo da VTEX e acesse o espaço destinado ao aplicativo.

  1. No menu lateral, vá em Storefront e clique em Headless CMS.

  2. Para iniciar a configuração, clique em "Criar Documento" e selecione a opção "Content Container".

Adicionando Conteúdo (Aba Seções)

  1. Acesse a aba "Seções".

  2. Clique no ícone de "+" e insira os componentes desejados da lista abaixo:

  • Lista de Produtos

  • Carrossel de Produtos

  • Carrossel de Banners

  • Carrossel Genérico

  • Banner Código de Cupom

  • Carrossel e Coleção Thumbnail

  1. Configure cada componente conforme a necessidade da campanha.

Configuração adicionais (Aba Settings)

  1. Acesse a seção "Settings" e preencha os campos:

  • Título: Título do modelo, não será exibido no app.

  • Ativo: Define se o componente estará ativo ou não no app.

  • ID do local: Pode ser selecionado entre:

    • PdpBottom (Parte final da PDP),

    • PdpTop(Topo da PDP),

    • PdpBelowProductImage(Logo abaixo da imagem do produto.)

    • PdpBelowDescription(Abaixo da descrição do produto.)

    • PlpHeader(No cabeçalho da PLP),

    • PlpTop( Topo da PLP)

    • PlpEmptyState (Página de listagem de produtos quando a busca retorna vazia)

    • CartBottom (Parte final do carrinho)

    • EmptyCartBottom(Parte final do carrinho quando está vazio).

  • ID do Local Personalizado: Esse campo só é utilizado quando o ID do Local = custom. Ele permite criar um local de exibição personalizado desenvolvido especificamente para aquele contexto.

    Exemplo:

    ID do Local = custom

    ID do Local Personalizado = home_campaign_blackfriday

  • Contexto de Visibilidade: Define em qualsituação o conteúdo será exibido no app.

    • Product ID(Exibe o conteúdo apenas em produtos específicos.)

    • Product Collection(Exibe o conteúdo apenas para produtos de uma coleção)

    • Product Category(Exibe o conteúdo apenas em produtos de uma categoria.)

    • Product Search(Exibe o conteúdo apenas em resultados de uma busca específica.)

    • User Cluster(Exibe o conteúdo apenas para um grupo de usuários definido pela plataforma de e-commerce.)

    • Always Visible( Exibe o conteúdo para todos os usuários, sem filtro.)

  • Critérios de Filtro: Define quais categorias, coleções, produtos ou buscas devem atender a opção escolhida no Contexto de Visibilidade.

  • Exemplo:

  • Contexto = Product Collection

  • Critério = 416- ID da VTEX da Coleção

  • OBS: Quando o Contexto de Visibilidade for Product Category no campo Critérios de Filtro é preciso informar o caminho completo da categoria separados uma por “/”. Exemplo: 10/6 (Categoria pai/ Subcategoria)

  1. Ao finalizar a criação, lembre-se de clicar em Salvar e, em seguida, em Publicar para garantir que as alterações sejam armazenadas e o conteúdo seja disponibilizado no app.

Exemplo

Respondeu à sua pergunta?