Conhecendo o editor visual
4 min
Criado por: Vivian Maurelli em: 18/09/2020 16:10

Acessível através do menu Aparência > Meus temas > Personalizar, o editor visual é onde você cria e edita o visual e o conteúdo da sua loja virtual.

No editor visual você seleciona as fontes, cores, estilo de cabeçalho e rodapé, cadastra as informações de contato, banners, produtos exibidos na página inicial, redes sociais e demais informações da sua loja virtual.

editoer .png

Na coluna da esquerda você terá acesso à todas configurações gerais do visual e também é onde você vai inserir, ordenar ou remover as seções de conteúdo da página inicial.

Para agilizar o processo de criação da loja virtual recomendamos iniciar a criação do visual pela aba de Configurações.

Formato de imagem de produto, fontes, cores, exibição de preços e demais opções gerais do visual da loja virtual estão disponíveis nesta aba.

Uma dica importante: As cores selecionadas na aba Configuração > Cores são utilizadas em todos os elementos e seções da loja, insira as cores personalizadas nas seções apenas quando precisar alterar em uma seção específica, isto vai poupar trabalho e vai facilitar uma trocar uma cor principal ou secundária, por exemplo.

Na aba Seções ficam listadas todas as seções que estão inseridas na página inicial da sua loja virtual. As únicas seções fixas são o Cabeçalho e Rodapé, as demais você pode inserir, ordenar ou remover sempre que quiser.

A estrutura de cadastro de informações e edição da aparência de todas as seções possuem a mesma lógica, o que facilita a usabilidade para a configuração. Para adicionar uma seção basta você clicar no último bloco da listagem "Adicionar seção" e selecionar uma das mais de 25 seções disponíveis, que estão organizadas por grupos de conteúdo, imagens, produtos, marketing, social e multimídia.

A seção de HTML permite você criar uma seção totalmente customizada com o conteúdo que seu projeto precisa.

Para inserção de CSS personalizado basta acessar a aba Configuração > Estilo customizado (CSS) e inserir o código que desejar. Este CSS sobrescreve o CSS já existente no tema padrão.

Dica: em alguns casos será necessário o uso de !important na linha de código para ter a prioridade correta e ser renderizado no navegador.

O visual das páginas internas de navegação da loja como listagem e de detalhe de produtos também são editáveis. Para isto basta selecionar a página (1) e acessar as seções (2) que você deseja configurar.

Atenção: Todas as alterações realizadas e que você está visualizando no editor visual podem levar até 5 minutos para serem atualizadas na sua loja virtual. Isto acontece porque trabalhamos com cache em nossos servidores para melhor performance da sua loja.

 

Últimos artigos visitados