O banner na PLP das categorias ou coleções de produtos irá aparecer logo acima da lista dos produtos. Sendo voltado para dar mais ênfase naquela categoria ou coleção, e também quando houver promoções ou benefícios exclusivos.
Atualmente é possível utilizar os componentes abaixo para vincular os banners dentro de categorias ou coleções, são eles:
-
Mosaico de Banner
- Carrossel de Banner (Base usada para nosso tutorial)
-
Configurações Categorias (Card de Categoria)
Obs.: Importante ressaltar que criando o menu de categorias pelo CMS, é deixado de utilizar a opção nativa da VTEX, tendo que ser construída toda a árvore de categorias dentro do componente. Entretanto, os produtos de cada id de categoria da VTEX, são puxados na configuração conforme o id cadastrado.
Obs.: Para os banners na PLP é possível apenas os tamanhos P e G.
Configurando o Banner na PLP
- Entre no painel administrativo da VTEX ( exemplo: https://nomedaloja.myvtex.com/admin) e faça login com o e-mail que já possui acesso à ferramenta;
- Clique no módulo "Storefront"
- Na função "Headless CMS", acesse o componente "Home" e entre no conteúdo da home que está atualmente publicado.
- Escolha um componente de "Carrossel de Banners" já publicado ou crie um novo.
- Dentro do card do Banner escolhido, vá até o campo "PLP Banner" e clique em "Novo PLP Banner"
-
Ao abrir o modelo para edição, preencha apenas os campos indicados conforme as instruções abaixo:
-
- Título: com um nome que identifique o componente, ele não será exibido para os usuários
- Subtítulo (opcional): com uma descrição interna para o componente, ele não será exibido para os usuários
- Ativo: habilite o campo, para garantir que as alterações serão reproduzidas no app após a publicação.
- Selecionar Tamanho: escolha entre as opções P e G e selecione o tamanho desejado.
- Imagem: faça o download da imagem dentro do dimensionamento padrão do tamanho de banner escolhido.
-
- Exemplos:
.
Obs.: Caso o banner seja inserido no card de categorias dentro do menu construído pelo CMS, é importante publicar a árvore de categorias somente após a finalização completa da sua construção. Caso contrário, o app poderá apresentar categorias ausentes na visualização.
Ao final, lembre-se de salvar e publicar a alteração para que ela seja aplicada no aplicativo.
Caso fique com alguma dúvida, você pode enviar um e-mail para suporte@kobe.io.