Editar tema

Veja como instalar nossos temas:

• Tema Cyber;
• Tema Matrix;
• Tema Black Friday;
• Tema Sense;
• Tema Griff;
• Tema Duna;
• Tema Zion.

 

Para aprender a editar e salvar um tema na sua loja virtual, siga o passo a passo completo abaixo:

 

Editando seus temas

Nossa plataforma oferece opções interessantes capazes de facilitar o seu trabalho de personalização e edição do tema. Veja a seguir algumas das alternativas disponíveis:

• Personalizar: essa opção foi criada utilizando variáveis globais, ou seja, editando esses campos eles serão alterados automaticamente em sua loja, sem a necessidade de manipulação de código;
• Editar código (CMS): essa opção está disponível para todos os planos exceto para o Starter, ela permite maior liberdade na manipulação de toda estrutura da loja, código HTML e CSS da loja;
• Duplicar: esse recurso permite que você duplique o tema atual da loja e realize os ajustes necessários, sem interferir na sua loja caso ela já tenha sido publicada;
• Download do código: com essa opção você poderá realizar o download de todo o seu código;
• Importar código: com essa opção possível subir um arquivo de tema utilizando o seu código.

 

Acessando os temas

Para podermos realizar a edição o primeiro passo será acessar o Tema, seguindo os passos abaixo:

1- Com o Painel administrativo aberto, clique na opção Personalização >> Meus temas.

2- Na tela Meus temas você terá as opções informadas no início do tutorial:

• Personalizar;
• Editar código (CMS);
• Duplicar;
• Download do código;
• Upload do código.

 

 

Personalizar

1- Nessa parte você irá conseguir realizar a personalização de toda a sua loja, dentre elas alteração das cores dos botões, cor do cabeçalho, tamanho da logo, tipo de cabeçalho, grade de produtos, redes sociais, cor do rodapé, título das colunas de páginas informativas.

Aviso: essas opções podem variar conforme o tema utilizado. Caso você acesse a página de personalização e não apareça nenhuma opção, significa que seu tema está antigo e desatualizado.

 

2- Para personalizar seu tema, clique no botão Personalizar.

 

 

Na opção Personalizar, você poderá editar os seguintes campos: 

• Botões;
• Cabeçalho;
• Configurações de tema;
• Grade de produtos;
• Redes sociais;
• Rodapé.

 Todos esses campos serão melhores detalhados abaixo.

 

 

Aviso: essas opções podem variar conforme o tema utilizado. Caso você acesse a página de personalização e não apareça nenhuma opção, significa que seu tema está antigo e desatualizado.

 

Botões 

Botões: esse campo irá alterar as cores dos botões, cada opção terá o título e a descrição na lateral direita para facilitar a sua compreensão:

1- Para personalizar a cor dos botões, basta colar o hexadecimal no campo correspondente a opção que você deseja alterar. Ou utilizar o seletor de cor disponível.

 

 

Cabeçalho

Cabeçalho: além da alteração de cores, essa opção irá lhe permitir a alteração da altura da logo em pixel, permitir cabeçalho suspenso, se ele poderá ser exibido em suas landing pages e se deseja que a logo seja apresentada na lateral esquerda ou centralizada.

1– Para personalizar os campos de cores, basta colar o hexadecimal no campo correspondente a opção que você deseja alterar, ou utilizar o seletor de cor disponível.

2- Tamanho da Logo: você irá definir a altura da imagem em pixel.

3- Cabeçalho Suspenso: exibe o cabeçalho de forma suspensa durante a rolagem da página.

4- Exibir em Landing Pages: exibe ou oculta o cabeçalho em landing pages.

 

 

Configurações do tema

Configurações do tema: aqui você poderá definir a cor de fundo da loja, cor do texto, contador regressivo, estoque baixo, intervalo entre alerta e pop-up, fonte do texto e a URL da fonte.

1- Para personalizar os campos de cores, basta colar o hexadecimal no campo correspondente a opção que você deseja alterar, ou utilizar o seletor de cor disponível.

2- Contador Regressivo – Estoque Baixo: exibe estoque baixo no contador regressivo quando atingir este valor.

3- Intervalo de alertas: intervalo em dias para exibição de banners de alerta na loja virtual. Por exemplo: banner LGPD.

4- Intervalo dos pop-ups: intervalo em dias para exibição de banners pop-up. Por exemplo: banner newsletter.

5- Fonte do Texto: família da fonte utilizada nos textos da loja. Veja mais opções em https://fonts.google.com/

6- URL da fonte: URL da fonte utilizada nos textos da loja. Veja mais opções em https://fonts.google.com/

7- Carrinho lateral: alterna a exibição do carrinho entre lateral (ativo) ou suspenso (inativo).

8- Descrição da página: exibir descrições das páginas, landing pages e artigos.

9- Títulos de Vitrines: exibir nomes das vitrines como título.

 

 

Grade de produtos

Grade de produtos: nesse campo você poderá realizar a edição das cores da grade de produtos, exibição do botão Comprar ou Veja Mais e a quantidade de colunas no mobile.

1- Para personalizar os campos de cores, basta colar o hexadecimal no campo correspondente a opção que você deseja alterar, ou utilizar o seletor de cor disponível.

2- Botão Comprar: alterna entre a exibição do botão comprar ou o botão veja mais.

3- Duas colunas (Mobile): intervalo em dias para exibição de banners de alerta na loja virtual. Por exemplo: banner LGPD. 

 

 

Redes sociais

Redes sociais: aqui você poderá inserir as URLs das suas Redes Sociais, caso você não possua alguma rede social basta deixar o campo em branco.

 

 

Rodapé

Rodapé: nessa parte você poderá definir as cores do Rodapé, assim como os textos a serem exibidos e se esse rodapé será exibido em suas Landing Pages.

1- Para personalizar os campos de cores, basta colar o hexadecimal no campo correspondente a opção que você deseja alterar, ou utilizar o seletor de cor disponível.

2- Texto – Coluna A, B e C: se refere ao Título de cada coluna do rodapé.

3- Texto – Botão Newsletter: chamada do botão de inscrição na newsletter.

4- Texto – Newsletter: texto informativo do bloco de newsletter.

5- Texto – Newsletter: título do bloco de Newsletter.

6- Exibir em landing pages: exibe ou oculta o rodapé em landing pages.

 

 

Aviso: assim que finalizar todas as alterações, não se esqueça de clicar no botão Salvar alterações.

 

 

Editar código (CMS)

O CMS (Sistema de Gerenciamento de Conteúdo) é uma ferramenta integrada à Plataforma iSET que permite a edição, personalização, manipulação, alteração e extensão da forma como o catálogo da loja virtual funciona como um todo.

Através do CMS você passa a ter a liberdade de criar a estrutura visual que desejar em sua loja virtual.

Ao acessar os arquivos CMS você terá acesso a edição dos códigos da loja virtual utilizando HTML, CSS, Javascript e a toda uma sintaxe lógica com centenas de funções que poderão ser programadas de forma avançada, lhe permitindo que altere profundamente os elementos e páginas que compõem o catálogo de sua loja virtual iSET.

Aviso: antes de começar a utilizar essa funcionalidade em sua loja, pedimos que tire um tempo para ler nossos Termos de Uso e conhecer as regras que regem essa ferramenta e nossa relação com você e sua loja virtual. Clique aqui (https://www.iset.com.br/contrato/cms.html)

1- Para ter acesso aos códigos estruturais da sua loja, clique no botão Editar Código (CMS).

 

 

2- Na opção “Editar código (CMS)”, você terá acesso a todos os códigos de cada parte da sua loja virtual.

 

 

3- Nessa página você irá encontrar o código de cada parte da sua loja separado por pastas. Após realizar suas alterações, é só clicar no botão Salvar.

 

Após realizar suas alterações, é só clicar no botão Salvar.

 

 

4- Caso você queira voltar à página para o código padrão, basta clicar no botão Recarregar padrão. 

 

 

Duplicar

Esse recurso ele permite que você duplique o tema atual da loja e realize os ajustes necessários, para não interferir na sua loja atual, ou seja, a sua loja pode entrar em manutenção para pequenos ajustes sem a necessidade de colocar todo o site em manutenção, perdendo vendas. Tudo poderá ser realizado simultaneamente.

1- Para duplicar um tema, clique no botão Duplicar.

 

 

2- Após clicar no botão Duplicar, será carregada uma janela solicitando o preenchimento do nome do seu tema duplicado. Após digitar o nome, clique no botão Duplicar.

 

 

3- Após duplicar seu tema, ele será exibido em Outros Temas Disponíveis, na parte inferior do menu conforme imagem abaixo:

 

 

4- Após ter realizado todos os ajustes e o tema se encontrar da forma como deseja, você poderá publicar o Tema, para publicar seu tema duplicado basta clicar no botão Publicar.

 

 

5- Será aberta uma janela de confirmação da publicação, basta clicar no botão Publicar.

 

 

6- Quando você aplica um novo tema as informações inseridas como cadastro de produtos, banners, formas de pagamento e frete, irão permanecer, a única coisa que irá muda é a estrutura visual do catálogo.

 

Excluir Tema

1- Caso você queira excluir um tema, basta clicar no botão Remover.

 

 

2- Na tela Remover o tema, preencha o campo com o código indicado e clique em Remover tema.

 

 

Download do código

Com essa opção você poderá realizar o download de todo o seu código.

1- Para baixar o código do tema, basta clicar em Download do Código e o download iniciará automaticamente.

 

 

Importar Código

Com essa opção você poderá subir um arquivo de todo o seu código.

1- Também é possível fazer o upload de um tema, que você já possui baixado. Para isso, basta clicar em Importar Código.

 

 

2- Na página “Abrir” escolha seu tema e clique no botão “Abrir”.

 

 

3- O tema que você acabou de importar vai estar na parte inferior da página Outros  Temas disponíveis, conforme imagem abaixo.