Suporte Temas

Manual de instalação

MIfashion Kids

Comece por aqui!

O tema MIfashion KIDS é a opção perfeita para lojas especializadas em moda infantil. Sua versatilidade o torna adequado a uma ampla variedade de produtos e variações.

Se deseja uma loja com layout profissional e potencializar suas vendas, este tema é ideal para você.

Personalização facilitada

O tema possui um dashboard intuitivo e fácil de usar. Com uma ampla variedade de cores, você poderá personalizar o tema de forma única, totalmente alinhado com a identidade visual da sua marca e as necessidades da sua empresa. 

Documentação completa

Fornecemos um manual completo e didático, com um passo a passo que te guiará por todas as etapas de personalização e configuração de sua loja.

Suporte

Estamos comprometidos em fornecer o melhor suporte possível. Quando precisar de assistência, basta clicar aqui para ser redirecionado à nossa página de suporte de temas.
Lá, você encontrará respostas rápidas em vários tópicos e, se necessário, poderá abrir um chamado conosco por meio do formulário de contato.

Para questões relacionadas à plataforma, entre em contato diretamente com o suporte da Tray.

Você também pode conferir a Central de Atendimento da Tray, onde encontrará uma variedade de artigos e instruções úteis para configurar sua loja com sucesso.

Neste manual você encontra todas as configurações que precisam ser feitas dentro do painel administrativo da sua loja para que o tema seja instalado corretamente.

Leia todo o conteúdo dessa documentação e siga o passo-a-passo para que seu tema seja instalado e configurado na sua loja.

Este tema foi desenvolvimento levando em consideração uma composição de layout pré-determinada. Ao final, você conseguirá configurar o tema na sua loja como foi apresentado no momento da aquisição.

Caso ainda não tenha adquirido um tema da Microsum, você pode compra-lo clicando aqui.

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 de temas. Lá você poderá esclarecer as principais dúvidas através dos tópicos disponíveis, e se ainda precisar, abrir um chamado através do formulário de contato.

Caso precise de algum suporte relacionado à plataforma Tray, entre em contato diretamente com eles.

Aproveite e de uma olhada também na Central de Atendimento da Tray, onde você encontra diversos artigos ensinando como configurar a sua loja.

Você tem direito a suporte gratuito por 6 meses, válido a partir da compra do tema.

Suporte garantido nas seguintes ocasiões:
  • Esclarecimento de dúvidas sobre o tema e suas configurações;
  • Correção de possíveis bugs e comportamentos incorretos do tema;
  • Suporte realizado sempre considerando a versão mais recente do tema;
Suporte não garantido nas seguintes ocasiões:
  • Processo de instalação do tema;
  • Cadastros ou configurações no painel do lojista;
  • Recursos da plataforma que não sejam nativos do tema;
  • Customizações e melhorias do tema;
  • Versões do tema em que tenham edições no código HTML e CSS principal;
  • Lojas que tenham removido o logo da Microsum do rodapé do site.
Observação:

Não garantimos uma boa performance da loja e pontuação de pagespeed. O desempenho depende das imagens e configurações realizadas.

Sempre que identificamos algum problema ou comportamento incorreto no tema, realizamos as correções necessárias e enviamos a atualização para a Tray.

Assim, todos os lojistas que possuem o tema, podem baixar a versão mais recente.

Recomendamos que as personalizações via código só sejam realizadas por profissionais ou pessoas que entendam de HTML, JavaScript e CSS.

Caso preciso, para validarmos o comportamento do seu tema, é necessário que tenha instalado a versão mais recente e que não haja nenhuma alteração/personalização via código. Se houver, iremos solicitar que atualize o tema, instalando a versão mais recente para que possamos prestar o suporte solicitado.

Se desejar, leia: Como Atualizar o seu Tema sem Perder as Configurações?

Painel de edição

Para acessar essa seção, em seu painel Tray, vá em Minha Loja > Aparência da Loja > Editar tema > Minha loja.

No painel Minha Loja, você poderá configurar as informações básicas da loja, como informações de redes sociais e informações de contato.

Redes sociais

  • Facebook
  • Instagram
  • Twitter/X
  • Pinterest
  • LinkedIn
  • YouTube
  • TikTok

Preencha somente o usuário na rede social, pois o tema já faz o tratamento com o link para direcionar para a rede social corretamente.

Observação:

Caso não tenha perfil em alguma rede social, basta deixar o campo vazio e o mesmo não aparecerá em sua loja.

Informações da loja

Preencha as informações de contato da loja para interação com seus clientes. Veja o que cada campo significa abaixo:

  • Telefone: telefone de contato que é exibido no rodapé e nas informações de contato;
  • WhatsApp: número do WhatsApp que é exibido na loja e usado no WhatsApp flutuante;
  • E-mail: e-mail principal de contato;
  • Horário de funcionamento: horário de atendimento que é exibido no rodapé e nas informações de contato.

 

Observação:

Caso não queira utilizar alguma das opções, basta deixar o campo vazio e o mesmo não aparecerá em sua loja.

Logo

Tamanho recomendado: 300 x 104 px

A logo da sua loja deve ser inserida na página de imagens padrões. Tem um link de redirecionamento para a página.

Loja em Manutenção

Caso queira deixar a sua loja em modo manutenção, basta ativar essa opção. Insira o texto que aparecerá na tela. 

Caso queira, pode inserir uma imagem personalizada (tamanho recomendado: 1676 x 1156 px ). Caso não insira, há uma imagem pré-definida.

Para acessar essa seção, em seu painel Tray, vá em Minha Loja > Aparência da Loja > Editar tema > Cores.

Aqui você pode personalizar várias cores da estrutura do seu tema, como cor de títulos e textos, cor de botões, do menu, entre outros. Personalizando as cores, você pode aplicar a identidade visual de sua marca em várias estruturas do tema.

Observação:

Sempre que precisar visualizar uma edição realizada, clique no botão Visualizar que há na parte inferior do painel, assim você pode acompanhar as alterações feitas.

As variáveis de cores são especificadas no formato hexadecimal (ex.: #000000). Você pode fornecer o código no campo, ou clicar na caixa ao lado do campo para abrir o seletor de cor. Ao clicar numa cor, o seletor de cor irá preencher com o código hexadecimal equivalente a cor escolhida.

Quando nenhuma cor for preenchida nos campos de configuração da variável em questão, será considerada a cor padrão do tema demonstrativo.

Para acessar essa seção, em seu painel Tray, vá em Minha Loja > Aparência da Loja > Editar tema > Imagens.

Régua de Informações

Refere-se aos ícones e informações que aparecem logo abaixo do banner principal:

Preencha os 4 blocos com o link do ícone, o texto proncipal (que aparece em maior destaque) e o texto secundário (texto menor abaixo do texto principal).

Você escolhe o ícone que desejar no site https://fontawesome.com/. Ao escolher o ícone, copie o código HTML do mesmo (conforme a imagem abaixo) e cole no campo indicado no painel de edição do seu tema.

Marcas

Nesta seção, você pode incluir até 10 marcas, que aparecerão na Home da sua loja. Faça o upload das imagens para o carrossel e insira o nome das marcas da mesma forma que as mesmas estão cadastradas no painel Tray.

Tamanho recomendado: 300 x 100 px

Observação:

O nome do arquivo não deve conter espaços, caracteres especiais e nem números. Salve o a imagem sem espaços ou caracteres especiais (ex: arquivo.png).

Caso deseje, você pode trocar as marcas por categorias, seguindo as mesmas orientações.

Tabela de Medidas

Aqui você pode inserir uma imagem para ilustrar as medidas e tamanhos de seus produtos. Este campo ficará disponível na página de todos os seus produtos. Não é possível selecionar produtos específicos ou inserir imagens diferentes para produtos diferentes.

Tamanho recomendado: 998 x 699 px

Observação:

O nome do arquivo não deve conter espaços, caracteres especiais e nem números. Salve o a imagem sem espaços ou caracteres especiais (ex: arquivo.png).

Feed do Instagram

O Feed com as imagens do perfil do Instagram ficará disponível acima do rodapé de seu site. Insira 8 imagens para compor essa seção. O link de redirecionamento para o perfil do Instagram é o mesmo do campo de redes sociais em Minha Loja.

Tamanho recomendado das imagens: 195 x 195 px

Observação:

O nome do arquivo não deve conter espaços, caracteres especiais e nem números. Salve o a imagem sem espaços ou caracteres especiais (ex: arquivo.png).

Pop-up de entrada

Refere-se ao pop-up de newsletter que aparece assim que algum usuário acessa a sua loja.

Tamanho recomendado: 444 x 374 px

O recurso Newsletter é utilizado para capturar o contato dos clientes e adicioná-lo a uma lista de pessoas que desejam receber informações enviadas pela loja.

Observação:

O nome do arquivo não deve conter espaços, caracteres especiais e nem números. Salve o a imagem sem espaços ou caracteres especiais (ex: arquivo.png).

Para acessar essa seção, em seu painel Tray, vá em Minha Loja > Aparência da Loja > Editar tema > Layout.

Aqui é onde você pode ativar/desativar os recursos disponíveis no tema que queira utilizar em sua loja. Desta forma, você mantém apenas o que faz sentido para sua marca.

Configurações Gerais

  • Exibir pré-carregamento personalizado: animação que aparece na tela enquanto a página é carregada no navegador. As cores são definidas de acordo com as cores principal e secundária configurada na seção Cores;
  • Exibir menu flutuante de redes sociais: menu flutuante que fica disponível no canto inferior direito da tela;
  • WhatsApp flutuante: botão do WhatsApp disponível no canto inferior esquerdo;
  • Exibir notícias na Home;
  • Exibir marcas na Home: refere-se ao carrossel de marcas configurado na seção de Imagens do painel;
  • Exibir Newsletter na home: campo para captação de e-mails disponível acima do feed do Instagram na home do site;
  • Ativar aviso de cookies: aviso de uso de cookies que aparece assim que um usuário acessa alguma página de sua loja. O texto deste aviso é personalizado. Não é necessário incluir o texto “política de privacidade”.

Menu e Cabeçalho

  • Barra de informações: refere-se a barra de informações do topo do site. O texto pode ser personalizado;
  • Menu ofertas: referente ao último item do menu, onde aparece 3 produtos promocionais da sua loja;
  • Produtos no menu: mostra um produto em destaque em categorias que possuem subcategorias. Disponível apenas na versão desktop ao passar o mouse;
  • Quantidade de categorias: defina a quantidade de categorias que irá aparecer no menu.

Seção de Desconto

Seção que aparece abaixo da régua de informações na Home. É aqui que você irá definir os textos , o período de duração e incluir o código do cupom que ficará em destaque.

Vitrines

Defina as configurações da listagem de produtos na Home.

Informações Gerais

  • Compra rápida simples: quanto ativada, o cliente pode inserir o produto (sem variação) no carrinho direto da Home, sem precisar acessar a página individual do produto;
  • Compra rápida variação: mesma configuração da compra rápida simples, mas para produtos que possuem variações;
  • Mostrar segunda imagem ao passar o mouse: mostra a segunda imagem do produto, na versão desktop, ao passar o mouse;
  • Ordenar os produtos de forma aleatória nas vitrines: quando não ativa, os produtos são ordenados em ordem alfabética;
  • Quantidade de produtos nas vitrines: defina a quantidade de produtos que irá aparecer nos carrosséis de cada vitrine.

Primeira Vitrine

Defina o título da vitrine, quais produtos irão aparecer (Destaques, Lançamentos, Mais Vendidos ou Promocionais). Caso queira, pode selecionar uma categoria específica.

Segunda Vitrine

Defina o título da vitrine, quais produtos irão aparecer (Destaques, Lançamentos, Mais Vendidos ou Promocionais). Caso queira, pode selecionar uma categoria específica.

Vitrine Destaque

Esta seção é onde você pode dar destaque em alguma categoria específica.

Informe os códigos dos produtos da categoria que você quer dar destaque. Após, escreva os títulos, texto e insira o código da categoria, para que o cliente seja redirecionado a página da categoria em questão.

Informações do Produto

  • Filtro lateral nas páginas de categorias e buscar;
  • Avaliações de produtos: mostra as avaliações e comentários dos produtos na página do produto;
  • Exibir produtos relacionados: exibe, produtos da mesma categoria, de forma aleatória, na página do produto;
  • Ícones das tags: escolha quais ícones irão compor as tags de Destaque, Lançamento, Extra e qual será o texto da tag extra.

Você escolhe o ícone que desejar no site https://fontawesome.com/. Ao escolher o ícone, copie o código HTML do mesmo (conforme a imagem abaixo) e cole no campo indicado no painel de edição do seu tema.

As tags são definidas no cadastro de produto.

Seção de Vídeo

Defina o título da seção e insira os links do canal do YouTube e do vídeo que irá aparecer na Home.

Pop-up

Ative ou desative os pop-ups de entrada e saída.

O pop-up de saída mostra três produtos, aleatoriamente, que estão em promoção em sua loja. Você pode escrever o texto que irá aparecer noeste pop-up.

Cadastro de banners

Os banners são elementos que compõem um site e que chamam bastante atenção dos clientes que acessam a sua loja. por isso, no tema MIfashion, colocamos os mesmos em posições estratégicas.

Os banners e minibannes são cadastrados diretamente pela plataforma Tray. Para acessar o locar de cadastramento, vá em Marketing > Banners.

Tenha uma atenção especial para o banner principal. Para inserir mais de um banner é necessário habilitar o campo banner rotativo (imagem abaixo) no momento de cadastrar o banner. Por padrão, a plataforma fornece, a princípio, a inclusão de 2 banners. Para incluir mais imagens, basta clicar em incluir mais fases (imagem abaixo):

Observação:

Por padrão, a plataforma permite a inclusão de até 6 banners rotativos.

Atenção:

Os banners precisam ser nomeados corretamente. A plataforma não aceita arquivos nomeados com espações, caracteres especiais e texto em caixa alta. Salve as imagens de forma simples e objetiva (ex.: nome-banner.jpg). 

Links recomendados:

Como Cadastrar Banners em sua Loja?

Como Cadastrar Banners Rotativos em sua Loja?

Full banner desktop

Local de exibição: Banner Home.

Full banner mobile

Local de exibição: Banner Home Mobile.

Minibanners 1 a 4

Locais de exibição: Extra 1, Extra 2, Extra 3 e Extra 4. Não há variações para desktop e mobile.

Local de exibição: Extra 4.

Banner Newsletter

Imagem de fundo da seção Newsletter da Home do site. Local de exibição: Extra 7. Não há variações para desktop e mobile.

Banner Títulos

Banner que aparece nas páginas de categorias. Local de exibição: Banner Títulos (selecione a categoria em que o banner irá aparecer). Não há variações para desktop e mobile.

Obs.: É possível cadastrar diferentes banners neste local de exibição, para isso, repita o cadastro de banner selecionando a categoria em qual a imagem irá aparecer.

Configurações da loja

Alguns elementos visuais da sua loja são configurados através da tela de Imagens Padrões.

Para acessar essa página, vá em Minha Loja> Aparência da loja > Imagens Padrões.

Ao acessar essa página, irá aparecer uma lista (imagem abaixo). Você não precisa configurar todos os campos.

Recomendamos que você faça o uploud das seguintes imagens padrões:

  • Favicon: um pequeno ícone que representa a logomarca de sua empresa (a imagem precisa ser com extensão .ico e 16 ou 32 pixels);
    Logotipo: Imagem utilizada na loja. O logo inserido por aqui será exibido em seu site, na página da central do cliente e como capa social para sua loja;
  • Logo para e-mails: sua logo que irá aparecer nos e-mails que sua loja envia aos clientes.

Este tema foi desenvolvido pensando em apresentar os produtos com o máximo de detalhes em suas imagens. 

Para isso, recomendamos que as imagens dos produtos cadastrados estejam nas dimensões 1200 x 1700 px. Seguindo este padrão, as imagens terão um zoom maior na página do produto. 

Observação:

Lembrando que as imagens não podem pesar mais que 350 kB. Se desejar, utilize a ferramenta tinypng para reduzir o tamanho das imagens sem perder a qualidade.

A sua loja deve ter páginas relacionadas a operação e a empresa. Essas páginas possuem conteúdo fixo, diferente da página principal, página de produtos, categorias, carrinho e painel do cliente. As páginas extras mais comuns são: Sobre a Empresa, Segurança, Como Comprar, Pagamento e Políticas de Trocas e Devoluções. 

Para acessar essa página, vá em Minha Loja> Páginas Internas.

Você poderá alterar as informações cadastradas para cada uma das páginas, além de cadastrar novas páginas de acordo com sua necessidade. Os links para essas páginas aparecerão no rodapé da sua loja.

Link recomendado: Como Configurar as Páginas Internas?

Se tem algo que não pode faltar em uma loja virtual é a forma de pagamento. Cartão de crédito, boleto e PIX são as mais utilizadas.

Para configurar as formas de pagamento que serão aceitas pela sua loja acesse Configurações > Pagamento > Geral.

Atenção:

A Tray disponibiliza vários intermediadores de pagamentos em sua plataforma. Alguns desses intermediadores necessitam de uma contratação prévia. Veja a lista completa clicando aqui.

Link recomendado: Configurações de formas de pagamento

A função de Notícias da Loja é uma ferramenta da Tray que permite apresentar aos seus clientes informações e conteúdo de qualidade. Um blog dentro da sua loja virtual.

Além de vender, você consegue oferecer notícias sobre o seu negócio, novidades dos produtos e campanhas

Para acessar a página de notícias, através da plataforma Tray, vá em Marketing > Notícias da Loja.

Link recomendado: Como Habilitar as Notícias da Loja?

Alterações via código

O nosso tema foi desenvolvido com diversas personalizações através do painel do tema e do painel administrativo da Tray, de modo a facilitar o controle da sua loja. Claro que isso não impede você de querer modificar ou incluir recursos que façam sentido para sua loja.

Para fazer qualquer modificação mais complexa no seu tema, é necessário que ele não esteja publicado. Não é preciso tirar a sua loja do ar ou colocá-la em modo manutenção. Basta duplicar o tema. Caso o tema não esteja publicado em sua loja, você pode fazer as alterações sem a necessidade de duplicar o tema, mas sempre recomendarmos duplicá-lo.

Para acessar o código do tema, acesse Minha Loja > Aparência da Loja > no seu tema clique na setinha apontando para baixo e clique em Duplicar. Se desejar, você pode alterar o nome do tema para facilitar o acesso posteriormente.

Atenção:

Recomendamos criar uma cópia do tema antes de editar os códigos HTML e CSS. Assim, caso aconteça algum problema você poderá retornar ao tema original. Vale lembrar que a Microsum 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.

Não damos suporte a temas que sofreram alterações no código. O nosso suporte é sempre na versão atualizada do tema, sem ajustes no código.

Configurações realizadas!

É obrigatório que toda loja virtual tenha um certificado de segurança (SSL) ativo em sua loja.

Link recomendado: O que é e Quais são os Benefícios do Certificado de Segurança SSL?

A Tray já processa os pedidos em ambiente seguro com SSL, mesmo que o domínio personalizado não o possua. Repare que ao ir para a finalização do pedido, se o domínio da loja não possui SSL, o commercesuite.com.br é utilizado no lugar do domínio próprio. Isso garante que os dados de seus clientes trafegue em um ambiente seguro.

Entretanto, é altamente recomendado que você tenha um certificado ativo em todo o seu site, pois além de dar segurança para seus clientes, navegadores como Google Chrome, Mozilla Firefox e Microsoft Edge podem bloquear páginas sem SSL, alertando a todos que tentarem acessar que aquela página não é segura.

Você pode contratar o certificado SSL diretamente com a Tray. Para isso, vá em Configurações> Loja > Domínios.

Parabéns! Você realizou todas as configurações necessárias para sua loja começar a vender.

Deseja realizar configurações personalizadas em sua loja? Então clique aqui e vamos bater um papo.