Como usar as Vitrines na loja virtual?

Resumo do Conteúdo

O que é o sistema Vitrines e como ele funciona?

A nova funcionalidade Vitrines veio para facilitar a personalização do catálogo da sua loja virtual sem a necessidade de alterar códigos HTML.

Será possível criar várias vitrines como desejar, usando elementos (como os seus produtos da loja), galerias, carrossel, banners e também código HTML se desejar.

Com isso, você poderá usar as vitrines em várias páginas da sua loja virtual, como landing pages, página de início, posts do blog e muito mais!

Além disso, você também poderá personalizar o posicionamento desses blocos sem precisar saber HTML.

 

Quais são as vantagens das Vitrines?

É possível criar em sua loja virtual várias vitrines com conteúdo estático e dinâmico e no formato, estrutura e sequência que você desejar. As vitrines são compostas de elementos de diversos tipos como listas de produtos em formato carrossel ou galerias, banners e até código HTML se desejar.

 

 

Você consegue personalizar a exibição dos elementos em suas vitrines de forma visual, clicando e arrastando os blocos, sem precisar ter conhecimentos de códigos. Veja abaixo:

 

 

Como usar as vitrines na loja virtual?

Para saber como criar suas vitrines e usá-las na sua loja virtual, siga o tutorial abaixo:

1- Acesse o painel administrativo da sua loja virtual e, no menu lateral esquerdo, clique em “Minha loja >> Vitrines”.

 

 

2- Para criar suas vitrines, primeiramente é preciso configurar os elementos que estarão nelas. Por isso, clique em “Minha loja >> Vitrines >> Elementos”.

 

 

3- Na tela “Elementos”, para criar um novo elemento para a sua vitrine, clique em “Novo elemento”.

 

 

4- Selecione o tipo de elemento, as opções são:

  • Bloco HTML: elemento em código HTML;
  • Carrossel de Produtos: carrega produtos da loja conforme os filtros definidos;
  • Galeria de Produtos: carrega produtos da loja em galeria com possibilidade de paginação.

 

 

Como criar um elemento Bloco HTML

4.1- Bloco HTML: ao escolher essa opção, a tela “Novo Elemento de Visualização” abrirá com um editor de HTML para que você insira códigos personalizados.

4.1.1- Para usar essa opção, basta colar o código no editor.

 

 

4.1.2- Depois, escolha a opção de “Template de exibição”.

 

 

4.1.3- Por fim, clique em “Inserir”.

 

 

Como criar um elemento Carrossel de Produtos

4.2- Carrossel de Produtos: ao escolher essa opção, a tela “Novo Elemento de Visualização” abrirá com as configurações:

4.2.1- Escolha um título para essa box em “Título”.

 

 

4.2.2- Defina o número máximo de itens poderão ficar visíveis na box.

 

 

4.2.3- Defina se deseja usar os “Pontos de navegação” e as “Setas de navegação”.

 

 

4.2.4- Depois, é preciso escolher a forma de obtenção dos produtos. Há duas opções:

  • Filtro;
  • Manual.

 

 

4.2.4.1- Filtro: com a forma de obtenção dos produtos de filtro, você terá as seguintes configurações:

  • Limite de registros a ser carregado: defina o número máximo de itens a serem obtidos de forma aleatória para a visualização.
  • Ordem de registros: você pode escolher qual a ordem de exibição dos produtos, como menor preço.
  • Regras: você pode definir regras para filtrar os produtos.

4.2.4.2- Manual: com a forma de obtenção dos produtos de filtro, você pode selecionar manualmente quais produtos deseja adicionar no carrossel. Para isso, basta clicar em “Adicionar produto(s)” e marcar os escolhidos.

4.2.5- Após escolher a forma de obtenção dos produtos e configurá-las, escolha o template de exibição que você deseja usar no carrossel.

 

 

4.2.6- Por fim, clique em “Inserir”.

 

Como criar um elemento Galeria de Produtos

4.3- Galeria de Produtos: ao escolher essa opção, a tela “Novo Elemento de Visualização” abrirá com as configurações:

4.3.1- Escolha um título para essa box em “Título”.

 

 

4.3.2- Defina o número máximo de itens poderão ficar visíveis na box.

 

 

4.3.3- Defina o número máximo de colunas para a sua galeria de produtos. Também defina se deseja ou não usar a paginação.

 

 

4.3.4- Depois, é preciso escolher a forma de obtenção dos produtos. Há duas opções:

  • Filtro;
  • Manual.

 

 

4.3.4.1- Filtro: com a forma de obtenção dos produtos de filtro, você terá as seguintes configurações:

  • Limite de registros a ser carregado: defina o número máximo de itens a serem obtidos de forma aleatória para a visualização.
  • Ordem de registros: você pode escolher qual a ordem de exibição dos produtos, como menor preço.
  • Regras: você pode definir regras para filtrar os produtos.

4.3.4.2- Manual: com a forma de obtenção dos produtos de filtro, você pode selecionar manualmente quais produtos deseja adicionar no carrossel. Para isso, basta clicar em “Adicionar produto(s)” e marcar os escolhidos.

4.3.5- Após escolher a forma de obtenção dos produtos e configurá-las, escolha o template de exibição que você deseja usar no carrossel.

 

 

4.3.6- Por fim, clique em “Inserir”.

 

 

5- Pronto! Com seus elementos criados, agora você já pode criar suas vitrines. Para isso, clique em “Minha loja >> Vitrines>> Gerenciar vitrines”.

 

 

6-  Na tela “Gerenciar vitrines”, para criar um novo elemento para a sua vitrine, clique em “Nova vitrine”.

 

 

7- Uma tela abrirá para você selecionar os elementos que deseja usar na vitrine a ser criada. Use a caixa de seleção para definir quais serão usados e clique em “Inserir elemento(s)”.

 

 

8- Na tela “Nova vitrine”, configure as seguintes opções:

8.1- Defina o nome da sua variável para você poder usar sua vitrine em vários locais da sua loja virtual em “Referência”.

 

 

O nome referência da vitrine deverá conter apenas letras e sem caracteres especiais. Por exemplo: produtos_em_destaque

8.2- Defina o nome da sua vitrine em Nome da vitrine e uma descrição  em Breve descrição.

 

 

8.3- Depois, se desejar você pode adicionar mais boxes em sua vitrine, como:

  • Elemento;
  • Banner.

 

 

8.3.1- Elemento: para adicionar um novo elemento à sua vitrine, clique emAdicionar Elemento e selecione qual/quais elemento(s) desejar usar.

8.3.2- Banner: para adicionar um novo elemento à sua vitrine, clique em Adicionar Banner e selecione qual/quais banner(s) desejar usar.

8.4- Organize as boxes na sua vitrine como desejar em Vitrine. Veja abaixo:

8.5- Por fim, clique emInserir para salvar sua vitrine criada.

 

 

9- Com a vitrine criada, na tela Gerenciar vitrines, você verá suas vitrines. Você pode fazer algumas ações como:

 

 

9.1- Na página gerenciar vitrines você terá algumas opções para alterar sobre suas vitrines, como, por exemplo:

  • Ativar ou desativar o status da vitrine;

 

 

  • Editar a vitrine;

 

 

  • Excluir a vitrine;

 

 

  • Copiar a Variável da vitrine para aplicá-la onde desejar na sua loja virtual, como páginas, vale lembrar que quando copiado o código da vitrine, ele poderá ser colado em vários lugares da loja, como descrição de produtos, páginas de informações, blog, landing pages ou até em arquivos do template através do CMS.

 

 

Ficou com alguma dúvida? Entre em contato com o nosso suporte via chat online.

Deixe um comentário

O seu endereço de e-mail não será publicado.