Este tutorial tem como objetivo apresentar o novo Editor Visual de Layout. E como configurar os componentes de banners, carrossel de produtos do site, entre outros componentes de layout da sua loja.
1- Para localizar a nova tela de Componentes da Página Inicial, acesse o menu Configurações>>Layout e Cores> Template da Página Inicial, e você será redirecionado para o novo Editor Visual de Layout.
2- Ao lado direito da tela se encontra todos os componentes disponíveis:
3- Para adicionar um novo componente a listagem principal, basta localizar o componente desejado, (aqui para exemplo, estou usando o Componente de banner Principal) e clicar no “+” para adicionar a última posição, ou segure e arraste com o mouse até a posição desejada:
4- Após esse último passo, o componente já se encontra posicionado no conteúdo da página, juntamente com demais componentes já adicionados, onde é possível visualizar todos:
5- Com o componente adicionado, e clicado, irá abrir ao lado direito as propriedades, que estará disponível as configurações de cada componente:
5.1- Nome Identificação para pesquisa: Já vem com o nome padrão do componente, mas caso desejar pode colocar o nome mais adequado para melhor localização da listagem do conteúdo da página.
5.2- Status: Se irá ativar ou inativar o componente.
5.3- Período de exibição: Pode ser exibido sempre(irá ficar visível até inativação manual) ou Período de exibição específico(podendo utilizar uma data inicial e final para o componente parar de exibir automático).
6- Dentro das propriedades é também o local onde será adicionado as imagens dos banners desse componente, e poderá ser visualizado os banners após o cadastro:
6.1- Para adicionar, basta clicar no botão de “+”, e irá adicionar mais um banner e clicando para expandir, terá o local de importação de imagens para Desktop e Mobile:
6.2 – Texto alternativo do banner(nome do banner), URL de Destino(redirecionamento) Status(ativo ou inativo) e Formato de Exibição(Exibir sempre ou configurar período especifico para exibir):
7- Após finalizar todas e qualquer alteração ou adição de componentes, sempre lembre de salvar, pois somente depois do salvamento, que irá refletir as mudanças em sua home da loja.
O botão Salvar fica disponível, na parte superior da tela do editor visual ao lado das propriedades.
Detalhe bem importante, ao salvar, a estrutura já faz automático a limpeza do cache, então não precisa fazer a limpeza manual, e o benefício é que as alterações já são visíveis de forma imediata na loja.
Para visualizar as alterações basta abrir home da loja, podendo clicar no botão de atalho do próprio editor visual:
Atenção: No canto inferior direito do editor visual, temos também um botão de instrução, onde também pode ajudar você na usabilidade da ferramenta:
