Documentação Netstore Religious

Documentação Netstore Religious

Manual de instalação e uso do tema Netstore Religious

Apresentação

Parabéns! Você acabou de adquirir o tema Netstore Religious. Agrademos muito por escolher um dos nossos temas para ser a identidade visual da sua loja. Estamos trabalhando sempre para aprimorar nossos temas, e qualquer feedback é muito importante para nós.

Sinta-se a vontade para enviar comentários e sugestões de melhorias para nós, indicando no campo de assunto do e-mail como Comentários e Sugestões Tema Netstore Religious. Clique aqui para nos enviar uma mensagem. Deixe sua avaliação, também, na loja de temas da Tray onde adquiriu esse tema.

Informamos que para melhor atendê-lo, todo o suporte, referente ao tema, será realizado exclusivamente via e-mail. Precisando de algum auxílio, basta clicar aqui e será redirecionado para a nossa página de suporte. Se preferir, você também pode acessar nossa base de conhecimento e esclarecer dúvidas rapidamente em um dos nossos vários tópicos. Dá uma olhada lá :)

Agora, caso precise de algum suporte relacionado à plataforma Tray, entre em contato diretamente com eles clicando aqui, para que possa ser esclarecido de forma rápida e assertiva. Na Central de Atendimento da Tray, é encontrado diversos artigos e instruções de como configurar a sua loja através das funcionalidades que a plataforma oferece.

Aproveite todos os recurso que você pode ter e configure uma loja completa para seus clientes!

Base de conhecimento Netzee

Esclareça suas dúvidas rapidamente sem precisar entrar em contato conosco.

Neste manual vamos apresentar todas as configurações necessárias que precisam ser feitas dentro do painel administrativo da sua loja para que o tema seja completamente instalado.

Leia todo o conteúdo dessa documentação e siga os passo-a-passos para que seu tema seja instalado e configurado corretamente na sua loja. O tema foi desenvolvimento levando em consideração uma composição de layout pré-determinado. Ao final dessa documentação você conseguirá configurar e deixar o tema na sua loja como foi apresentado no momento da aquisição.

Instalação

Ao adquirir um novo tema com a Tray, ele é disponibilizado na sua loja em questões de minutos. A partir desse momento o tema é seu e você poderá fazer qualquer modificação que desejar. Porém, apesar do tema estar instalado, ele ainda não está vísível publicamente ao seus clientes. A tray faz isso para que você possa editar o que precisar e deixar do seu jeito, sem que atrapalhe a sua loja, caso ela já esteja ativa e online.

Para encontrar os temas adquiridos basta ir em Minha Loja > Design da Loja. Nessa seção você irá encontrar todos os temas já instalados na sua loja, visualizar qual tema está publicado e quais estão disponíveis para publicação, visualizar uma prévia de um dos temas que possui, e ainda fazer edições no seus temas. Esses últimos pontos veremos mais adiante.

Vamos, então, publicar seu novo tema. Para isso é muito simples. Basta localizar o tema Netstore Religious e clicar no botão Publicar. O processo a partir desse ponto será automático. Ele pode demorar um tempinho, então não se preocupe. Recomendamos que aguarde cerca de 1 hora para que todo o processo ocorra. Esse tempo é para garantir que nenhum estilo do tema antigo entre em conflito com seu novo tema.

E não se preocupe, todos as customizações e alterações que você fez no seu tema antigo ainda estarão disponíveis nessa mesma página, na parte de Temas Instalados e não publicados.

Editar Tema

Agora que seu novo tema está ativo, vamos falar um pouco das customizações que você pode fazer. Existem várias alterações que você pode fazer no seu tema. Iremos abordar como realizar cada uma das opções disponíveis e onde elas se encontram.

Nas sessões abaixo iremos esclarecer como aplicar imagens ao tema, como personalizar as cores do layout, componentes padrões do layout adquirido, itens adicionais que podem ser colocados, redes sociais, informações gerais da loja, páginas extras, pagamento, menu principal e menu de marcas.

É possível cadastrar várias imagens dentro do tema que serão utilizadas na sua loja. Para isso é muito simples, basta acessar Minha Loja > Design da Loja > Editar Imagens Padrões. É possível inserir / alterar botões, logotipo, favicon, entre outros.


Depois de clicar em Editar Imagens Padrões, aparecerá a tela de alteração e inserção das imagens.

  • Na primeira coluna se encontra o nome da imagem;
  • Na segunda coluna está uma breve descrição;
  • Na terceira coluna fica uma prévia da imagem que foi inserida;
  • No botão com o ícone de pequeno lápis, é possível trocar a imagem que já está cadastrada e incluir uma nova;
  • No botão com o ícone de um 'X', a imagem é excluída.


Caso não deseje inserir imagens, os botões exibidos serão os padrões da plataforma e alguns já estão com estilização aplicados.

Algo que é muito importante no tema são as cores utilizadas. Elas refletem grande parte da identidade visual da loja. Nós programamos o tema de modo que você possa alterar todas as cores principais utilizadas. Para isso basta acessar Minha Loja > Design da Loja > Editar Tema.



Na seção de Cores e Layout você encontrará todas as cores utilizadas devidamente identificadas, para que você possa encontrar facilmente onde, no tema, aquela cor é usada. Basta clicar na pequena caixinha com a cor para escolher uma no seletor de cores que aparecer. Ou você pode, também, digitar o código hexadecimal referente a cor que deseja usar.



Se precisar de ajudar, visite a ferramenta Html Color Codes para auxiliá-lo nas escolhas das cores clicando aqui.

A Régua Fio é um recurso muito bacana que permite ilustrar pontos estratégicos da loja diretamente no tema, de modo que seu cliente se sinta atraente por algum daqueles pontos. Por exemplo, você quer deixar claro que compras acima de determinado valor terão frete grátis. Colocando essa informação na Régua Fio ela ficará em destaque e será mais facilmente assimilada pelo seu cliente.




Para configurar a Régua Fio, acesse Minha Loja > Design da Loja > Editar Tema e encontre a seção Banner Régua Fio.


Você poderá definir o título e a mensagem que quer que apareça. É possível adicionar até quatro itens na Régua Fio, cada um com um título e mensagem específicos.


Mas fique atento, pois não é possível alterar os ícones utilizados nem colocar links na Régua Fio através dessa opção.

Caso deseje adicionar o Banner no lugar da Régua Fio é possível pelo painel na opção de banner Extra1. Mostraremos como fazer essa configuração na seção de cadastro dos banners.

Observações:

  • Formato da Régua Fio é de 1170x90 pixels.
  • Caso a Régua Fio e o Banner Extra1 estiverem ativos ao mesmo tempo, os dois irão aparecer na loja.

A vitrine de produtos é um recursos muito bacana que permite colocar produtos em destaque na página principal da sua loja. Para configurar a Vitrine, basta acessar Minha Loja > Design da Loja > Editar Tema e procure e seção Vitrine.



Nela podemos inserir o título que desejamos para o bloco de produtos, a quantidade de produtos a ser exibido, exibir possíveis tags de desconto, definir se os produtos desse bloco serão exibidos em um carrossel, ou ainda se queremos que o cliente seja redirecionado diretamente ao carrinho ao clicar sobre o produto.


Considerações Importantes

  • A imagem do meu produto na vitrine está menor do que no tema demonstrativo, o que fazer?
  • Não se preocupe! Para resolver essa questão basta entrar em contato com a Tray pedindo o aumento da Thumb 180 para o tamanho correto de sua loja. Acesse a seção chamada Thumb deste manual e encontre o valor correto.

O tema Netstore Religious vem preparado com alguns itens adicionais bacanas, sendo eles Filtro Inteligente, Depoimentos, Notícias e Menu de Marcas. Esses itens adicionais são configurados acessando Minha Loja > Design da Loja > Editar Tema. Procure por Itens Adicionais e encontrará onde você consegue definir se deseja ou não que tais itens sejam exibidos.


Alguns deles são exibidos na página inicial da sua loja, logo antes do formulário de Newsletter. São eles: Depoimentos, Notícias e Menu de Marcas. O Filtro Inteligente, por sua vez é exibido na lateral esquerda da Página de Catálogo. Desabilitar a opção de Filtro Inteligente fará com que as categorias do site sejam exibidas.

Considerações Importantes

  • Ao cadastrar categorias na plataforma, apareceu uma chamada “Departamentos”. O que é?
  • “Departamentos” aloca as categorias que sobram ao chegar no limite de exibição no menu principal. Ao clicar nela, verá as categorias cadastradas que não são expostas no menu. Você pode definir qual irá aparecer no menu e qual será exibida na categoria “departamentos” ordenando os cadastros dentro de sua plataforma. SAIBA MAIS.

As redes socias são imprescindíveis para manter um contato mais próximo com seu cliente e fidelizá-lo na sua marca. Por isso nós adicionamos essa opção para você colocar todas as suas redes sociais e disponibilizá-las em sua loja.

Basta configurar acessando Minha Loja > Design da Loja > Editar Tema e procurar a seção Redes Sociais. Você pode configurar as seguintes redes sociais: Facebook, Instagram, Twitter, Youtube e Pinterest

O carrossel de marcas é um recurso muito bacana que disponibilizamos junto com o tema. Com ele, uma faixa com todas as marcas disponíveis na sua loja, será apresentada na página inicial, logo após os banners principais. Desse modo, você cria um fluxo direto para o produto que o cliente procura atráves da marca.

Atenção!

Os passos abaixo não podem ser feitos com o tema já publicado. Caso o tema já esteja publicado, será necessário duplicar o tema. Para isso vá em Minha Loja > Design da Loja, encontre o tema Netstore Religious, clique na setinha apontando para baixo e clique em Duplicar.

Para que o carrossel de marcas funcione corretamente é preciso ficar atento a vários pontos. Vamos começar com o cadastro das marcas no painel administrativo. Para isso acesse Produtos > Marcas e Fabricantes. Cadastre as marcas com as quais você irá trabalhar, incluindo o nome e o caminho pelo qual ela será acessada na sa sua loja. Saiba mais.

Fique atento como colocou o nome da marca. Isso será importante mais para frente.


Após cadastrar as marcas dentro do painel administrativo, precisamos cadastrar as logos referente a cada marca. A Tray, infelizmente, não disponibiliza enviar uma imagem ao cadastrar uma marca. Para que tudo fique funcional e atraente, nós iremos cadastrar as marcas como arquivos do tema. Para isso siga os passos abaixo:

  • Acesse Minha Loja > Design da Loja;
  • Encontre o tema Netstore Religious e clique no botão Editar HTML;
  • Na janela que abrir, clique na opção Upload de Arquivos;
  • Na janela que abrir, selecione a pasta img para fazer o upload das imagens das marcas;
  • Selecione as imagens das logos das marcas que deseja enviar e aguarde o término do processo.

Após esse procedimento as imagens serão carregadas automaticamente no carrossel de marcas.



Considerações Importantes

  • As imagens precisam ser no formato .png com fundo transparente para melhor visualização
  • As imagens devem ter tamanho exato de 200x60 pixels
  • As imagens precisam ter o mesmo nome das marcas, seguindo a seguinte regra:
    • Todas as letras devem ser minúsculas;
    • Caso a marca tenha só uma palavra, como por exemplo a marca Nike, o nome da imagem deverá ficar como nike.png;
    • Caso o marca seja composta de duas ou mais palavras, como por exemplo a marca Calvin Klein, o nome da imagem deverá ficar como calvin-klein.png;
    • Caso a marca possua letras com acentuação, elas deverão ter o acento removido, como por exemplo a marca Nestlé, o nome da imagem deverá ficar nestle.png;
    • Caso a marca possua caracteres especias, como ç, deverá ser trocado pela letra equivalente. No caso do ç, o c;
    • Caso a marca possua outros caracteres especias, como & ou ', eles deverão ser trocados por um hiffen. Por exemplo a marca Dolce & Gabbana, o nome da image deverá ficarr como dolce-gabbana.png.
    • Ao salvar a imagem, verifique se ficou como .png minúsculo e não .PNG maiúsculo, pois a plataforma não reconhece o segundo caso.
Caso tenha dúvida, clique aqui e utilize a ferramenta Text Edit Slugify (em inglês) para ajudá-lo.

O filtro inteligente é uma ótima maneira de otimizar a navegação do usuário dentro de sua loja. Aparecendo apenas nas páginas de catálogo de produtos, permite que o usuário procure o ítem de forma mais objetiva, sem precisar passar por produtos que ele não tem interesse, aumentando, assim, o engajamento de seu cliente. Para adicioná-lo, precisará de duas etapas.

Acesse Minha Loja > Design da Loja > Editar Tema e procure por Itens Adicionais. Em seguida localize a seção Filtro Inteligente e deixe a opção sim habilitada. Observação: Caso mantenha essa opção como não, aparecerá apenas um menu de categorias na página de catálogo de produtos.


Configurações

A sua vitrine é uma das partes mais importantes e influenciadoras em sua loja, portanto, a exibição de seu produto deve estar sempre na melhor forma possível. Por isso, aconselhamos que, após a compra desse tema, entre em contato com a Tray e solicite o aumento da Thumb 180 para 260x260px.

Segue o contato para abertura de chamados: Suporte Tray

Em uma loja existem várias informações que precisam ser cadastradas e exibidas, e algumas delas podem ser inseridos via Textos/Lang. Para configurar esses textos basta acessar Configurações > Textos/Lang.

Os principais utilizados no tema são os ag_telefone_1, ag_telefone_2, ag_email_1, ag_email_2, ag_atendimento e ag_mensagem_rodape. Cada possui um destino e local de exibição específico dentro do tema:

  • ag_telefone_1: Informações sobre telefone fixo / móvel exibidos no cabeçalho e no rodapé da loja.
  • ag_telefone_2: Informação sobre WhatsApp exibida no cabeçalho e no rodapé da loja.
  • ag_email_1: E-mail principal de contato exibido no rodapé da loja.
  • ag_email_2: E-mail secundário de contato exibido no rodapé da loja.
  • ag_atendimento: Horário de atendimento exibido no rodapé da loja.
  • ag_mensagem_rodape: Informações importantes da loja, como informações jurídicas e direitos autorais, exibido no rodapé da loja.


Para saber mais sobre essa funcionalidade da plataforma, acesse esse link.

Toda loja conta com páginas relacionadas a operação e a empresa. São páginas com conteúdo fixo, diferente da página principal, página de produtos, categorias, carrinho e painel do cliente. Algumas páginas extras comuns em lojas são: Sobre a Empresa, Segurança, Como Comprar, Pagamento e Envio. Essas páginas podem ser configuradas acessando Minha Loja > Páginas da Loja.

Você poderá alterar as informações cadastradas para cada uma das páginas, cadastrar novas páginas de acordo com sua necessidade (ex: colocar regras daquela promoção bem bacana que está pensando em fazer), alterar o caminho que o usuário irá usar pra ver as informações no navegador, desativar uma página que já não é mais necessária, ou ainda excluir alguma página que não tem mais utilidade.

Essas páginas serão listadas no rodapé da loja, e no caso do tema Netstore Religious, na seção Institucional, ao lado das informações de atendimento e funcionamento da loja.


Para saber mais sobre essa funcionalidade da plataforma, acesse esse link.

Outra parte importate de todas as lojas são as Formas de Pagamento. Cartão de Crédito, Débito em conta e boleto bancário são as mais utilizadas hoje em dia por dezenas de lojas. Para configurar as formas de pagamento que serão aceitas pela sua loja acesse Minha Loja > Formas de Pagamento.

Nosso tema ja é preparado para exibir as formas de pagamento automaticamente no rodapé da loja ao ativar as formas de pagamento. É simples assim. Não tem que fazer mais nenhuma modificação e seus clientes já estarão cientes quais as formas de pagamentos aceitas.

Atenção!

A Tray disponibiliza vários intermediadores de pagamentos em sua plataforma. Para algumas formas de pagamento é necessário uma contratação prévia com esses intermediadores. Caso precise de mais ajuda para configurar formas de pagamento na sua loja, clique aqui para acessar a Base de conhecimento da Tray que trata exatamente dessa questão.

Banners

Um elemento que chama muita atenção nas lojas são os banners. Eles podem possuir diversões tamanhos e composições, mas agradam por trazer um trabalho gráfico mais elaborado. Nosso tema utiliza-os em posições estratégicas.

Foram utilizados nesse tema banners com as seguintes localizações: Extra1, Extra2, Extra3, Extra4, Banner Home. Os banners podem ser cadastrados no painel administrativo acessando Marketing > Banners da Loja.


Tenha atenção especial ao Banner Home no momento do cadastro, pois é necessário marcar a opção Deseja cadastrar banner Javascript como Sim para que mais do que um banner aparece na página inicial da loja.


Os banners utilizados nesse tema possuem tamanhos diferentes dependendo da localização deles no tema. Para que as imagens fiquem legais e bem dispostas é necessário ficar atento as dimensões dessas imagens. Veja abaixo cada localização que utilizamos e a dimensão recomendada.

Full Desktop (Banner Home)
Dimensão: 2000 x 460 pixels


Full Mobile(Extra1)
Dimensão: 750 x 420 pixels
Caso não cadastre esse banner, o banner Home será exibido também no mobile.


Régua Fio (Extra2)
Dimensão: 1170 x 50 pixels
É exibido abaixo do Banner Full. Observações:

  • Caso não cadastre esse banner, os itens cadastrados no Item adicional Régua Fio serão exibidos.
  • Caso a Régua Fio e o Banner Extra1 estiverem ativos ao mesmo tempo, os dois irão aparecer na loja.


Banners Extras (Extra3)
Dimensão: 560 x 525 pixels
Esses banners serão exibidos logo acima carrossel de marcas. Para que seja exibido mais do que uma imagem, cadastre o banner Javascript.


Banners Extras (Extra4)
Dimensão: 1170 x 325 pixels
Esses banners serão exibidos logo abaixo do Carrossel de Marcas.

Código CSS

Caso você deseje modificar cores que não estão disponíveis via painel, ou ainda se preferir fazer isso editando diretamente os arquivos CSS do tema, você pode. Caso o tema já esteja publicado, será necessário duplicá-lo antes de fazer qualquer alteração.

Para duplicar o tema vá em Minha Loja > Design da Loja, encontre o tema Netstore Religious, clique na setinha apontando para baixo e clique em Duplicar.

Um arquivo CSS contem todo o estilo do tema. Nele são configurados além das cores, grids, botões, responsividade e muito mais. A customização das cores também pode ser feita diretamente via painel, como dito nos tópicos anteriores. Apesar de ser possível alterar qualquer coisa, recomendamos fortemente que altere somente as cores. Qualquer outra mudança pode prejudicar a exibição correta do tema. É importante frisar que as alterações feitas via CSS não são imediatas, ou seja, podem demorar até 15 minutos para aparecerem na loja.

Atenção!

Recomendamos criar uma cópia de segurança antes de editar os códigos HTML e CSS do seu tema. Assim, caso aconteça algum problema você poderá retornar rapidamente a um tema funcional. Vale lembrar que a Netzee não se responsabiliza por problemas gerados devido a edição do código

Somente edite o código do seu tema se tiver conhecimentos avançados em HTML, CSS e JS, caso contrário o tema poderá parar de funcionar na sua loja.

Para alterar diretamente o CSS acesse Minha Loja > Design da Loja > Editar HTML. Procure a pasta com nome CSS. Dentro dela você irá encontrar um arquivo chamado main.css. Será nesse arquivo que você deverá realizar as alterações que deseja. Recomendamos colocar quaisquer modificações no final desse arquivo, para que elas sobrescrevam os códigos anteriores do tema. O arquivo main.min.css se refere ao mesmo arquivo citado acima, porém está minificado.

Atenção!

É necessário que o arquivo seja minificado para que as edições se apliquem em sua loja.

Considerações Finais

Nós apreciamos imensamente a opinião do usuário final de nosso tema, ou seja, você! Assim temos como saber exatamente o que podemos melhorar. Por isso, deixe sua sugestão ou ideia do que pode ser feito para que seu tema e manual supra todas as suas necessidades aqui.

Você finalizou a documentação do tema e já pode usufruir dessa nova conquista! Reforçamos que qualquer modificação feita sem que o tema tenha sido publicado não estará disponível aos clientes até que o tema seja publicado. Veja o tópico Instalação e publicação do seu tema para verificar como fazer o procedimento mais uma vez.

É um prazer ter você como cliente. Caso tenha ficado com alguma dúvida ou precisa de um atendimento especializado, entre em contato com o nosso suporte clicando aqui.