# Apresentação

<figure><img src="https://1867547453-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ4r3plY0eHeW1iqIle6C%2Fuploads%2FES6kLXLPKxsRvp0akFkk%2FLogo-Ubee-digital.png?alt=media&amp;token=c5dcc19a-82c3-4350-8bd1-222c7c03b699" alt=""><figcaption></figcaption></figure>

> Olá parabéns, se você chegou até aqui, muito provavelmente você acabou de adquirir um de nossos temas para Plataforma Tray. Agradecemos a prefernência em escolher um de nossos temas para implantar em sua loja virtual e também pela confiança empregada em nós. Estamos sempre apromirando as funcionalidades exitentes e adicionando outrans exclusivas, e qualquer feedback é de extrema importância para nós.


# Manual

O manual tem a finalidade de apresentar todas as configurações necessárias dentro do painel administrativo de sua loja para que o tema seja completamente instalado.

Atente-se em todo conteúdo, extraia o máximo do tema para deixar sua loja linda além de uma máquina de vendas online.


# Suporte

Agora que você ja adquiriu o nosso tema, poderá entrar em contato conosco sempre que necessário através de nosso canal de suporte ao cliente.

## Atualização

O Suporte é exclusivamente relacionado ao tema, então quando encontrarmos algum problema, ajudataremos e mandaremos a atualização para a Tray. Logo após o mesmo é disponibilizado para todas as lojas que adquiriu o nosso tema através da Tray.

## Personalização

Para que consigamos realizar o suporte e validar o comportamento do tema, é necessário que não haja nenhuma personalização via código fonte em sua loja virtual. Caso houver, iremos solicitar que atualize o tema instalado a versão mais recente para que possamos prestar o suporte solicitado.

## Abertura de chamados

Informamos que para melhor atender, todo suporte referente ao **tema será exclusivamente via abertura de chamado.**

**Obs:\* Não prestamos suporte para a Plataforma**, em caso de problemas com funcionalidades que é **exclusiva** da **tray**, solicitamos que entre em contato com a equipe da plataforma para sanar as dúvidas ou problemas referente a ela através do link [**https://www.tray.com.br/canaisdeatendimento/**](https://www.tray.com.br/canaisdeatendimento/)


# Instalação

Ao adiquirir um novo tema com  a Tray, ele será disponibilizado em alguns minutos em sua loja virtual dentro da aba minha loja -> Aparencia da loja, a partir deste momento é possível realizar as mudanças que desejar.

Porém apesar do tema estar disponível, ele não será visivel para seus clientes, ou seja, ele não estará publicado. A Tray faz isso para que você possa editar o que precisar e posteriormente sem que atrapalhe o bom funcionamento de sua loja virtual, você poder publicar com total segurança.

Obs: Recomandamos que sempre faã uma cópia de segurança, duplicando o tema para que posteriormente você publique.

## Cuidado

Cuidado, não exclua o tema, caso isso ocorra por mais que seja por acidente, não conseguimos disponibilizar copias, neste caso, você precisará adquirir o tema novamente pela loja de temas da Tray.


# Como acessar o editor

No canto esquedo do painel da Plataforma, procure pela aba minha loja, posteriormente clique em aparência da loja virtual, logo abrirá uma nova página contendo o tema adquirido, procure pelo botão editar para que possa acessar as configurações exclusivas do tema.


# Minha loja

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/dH6uGFdzSab2A2OOWy5Z/image.png" alt=""><figcaption></figcaption></figure>

Na aba minha loja, você encontrará algumas opções que começar a configurar sua loja virtual, começando pela logo e Favicon(icone


# Adicionando Logo e Favicon

Para adicionar a logo de sua loja virtual, basta acessar a aba denominada Logo e Favicon, nesta aba você encontrará a opção para upload da imagem.&#x20;

Para uma melhor experiência e legibilidade, orientamos para que seja feito o upload de uma imagem de boa qualidade e que ela não seja muito grande para não impactar no carregamento de sua loja virtual.

Diminua sua imagem sempre na promorção correta através de editores de imagem. Recomendamos um tamanho minimo para sua logo de 100 x 50 Pixels e o formato PNG com fundo transparente de preferencia.

## Fazendo o upload da logo

No local onde há um box(quadrado tracejado) clique para abrir uma caixa onde você selecionará a imagem da logo ou arraste a imagem até o local.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/AkzQSfdthQ6zUkrYeiXq/image.png" alt=""><figcaption></figcaption></figure>

Após isso a logo será exibida no quadrado onde você adicionou a imagem, e logo abaixo informe o tamanho correto da imagem.&#x20;

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/CcM6KTZBWaU4Z1CPcymG/image.png" alt=""><figcaption></figcaption></figure>

Se você não for adicionar um favicon, recomendamos que clique em salvar alterações logo em seguida.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/qMvpSUyHqaxoipBL8Yfh/image.png" alt=""><figcaption></figcaption></figure>

## Favicon

O favicon é um item importante para sua loja virtual, ele mostra uma miniatura de sua logo ou uma parte dela logo acima da aba do navegador onde ao lago aparece o nome de sua loja virtual.

Para adicionar um favicon, você poderá seguir o mesmo procedimento acima, fazendo assim o upload da imagem.

Recomendamos um tamanho máximo de 32 x 32 pixels, pois, trata-se apenas de um icone e o formato .png ou .jpg

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/fBiCbLoAv6uSyDNJck0F/image.png" alt=""><figcaption></figcaption></figure>

Em seguida, recomendamos que clique no botão Salvr alterações antes de tentar visualizar as mudanças realizadas

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/IE6Yhm8oiw6A7tbnsu0r/image.png" alt=""><figcaption></figcaption></figure>


# Redes Sociais

Adicione o link de suas redes sociais mais utilizadas em sua loja virtual.

Para isso, basta copiar o link completo da rede social em questão e adicionar nos campos abaixo, conforme mostramos na imagem a seguir.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/KZzCihzzmyfaVNWmxhwI/image.png" alt=""><figcaption></figcaption></figure>

Sempre que fizer uma alteração através do editor de temas, clique no botão salvar alterações para que as mudanças realizadas sejam atualizadas corretamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/TvNZ5opFqfciqkrQnkw0/image.png" alt=""><figcaption></figcaption></figure>


# Informações da loja

Na aba a seguir, temos a área onde iremos adicionar as informações de contato e endereço físico(caso tenha) de sua loja virtual.

Complete as informações com telefone fixo, e-mail, whatsapp e endereço(opcional) para que seja exibida na loja virtual.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/R4wnXvqPylQRfbegPOsG/image.png" alt=""><figcaption></figcaption></figure>

Sempre que fizer uma alteração através do editor de temas, clique no botão salvar alterações para que as mudanças realizadas sejam atualizadas corretamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/88HAXIPk3QY9lfKrj7CK/image.png" alt=""><figcaption></figcaption></figure>


# Suporte ao tema

Na aba de suporte, separamos um formulário para facilitar a comunicação com nossa equipe.

Nesse local, caso haja **duvidas ou problemas relacionados ao tema comprado**, você poderá nos enviar uma comunicação para que possamos lhe ajudar.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/2pfq5Ws4RXRxTAcLxg5o/image.png" alt=""><figcaption></figcaption></figure>

Caso prefira, tambem poderá entrar em contato através do e-mail de suporte <suporte@wootemas.com>

O tempo de resposta será de até 72 horas, porem para um melhor controle, preferimos que nos comunique através do formulário apresentado no local.


# Cores

Na aba superior temos a opção de configurações de cores, nesse local, você poderá alterar as cores de sua loja virtual, deixando-a com as cores exatas de sua Empresa.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/HH4uaxEhj4SNNHNNzvRZ/image.png" alt=""><figcaption></figcaption></figure>


# Cores gerais do tema

Na aba lateral, quando se abre as opções de cores, temos a primeira configuração, onde você irá informar as cores gerais de sua loja virtual.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ONa2atX5I32im2YXEl6D/image.png" alt=""><figcaption></figcaption></figure>

"Brinque" a vontade com as cores, aqui a imaginação é sua e poderá adicionar da forma que desejar.

Lembre-se, toda alteração é recomendável que não deixe de clicar no botão abaixo Salvar alterações para que seja realmente atualizado no tema.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/sxxCJ20NTWrq4HMor9gS/image.png" alt=""><figcaption></figcaption></figure>


# Cabeçalho

Em cabeçalho, você poderá alterar todas as cores, incluindo icones

## Cores do pré Header

O Pré header é a barra acima do cabeçalho, onde se encontra o telefone, e-mail e alguns links pré configurados de sua loja virtual

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/eYsuMs1XXEyGWg1cOttl/image.png" alt=""><figcaption></figcaption></figure>

## Cores do Header

O Header é o cabeçalho principal, onde encontra-se a logo de sua loja, campo de busca e icones de login de cliente e carrinho de compra.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/TYuRBkKMIsEMEYBZcVVy/image.png" alt=""><figcaption></figcaption></figure>

## Cores do menu

Em cores do menu, você poderá alterar a cor do minu principal, textos e títulos

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/vwu2PCQJ5P3wN98Vy0yS/image.png" alt=""><figcaption></figcaption></figure>

Lembre-se, toda alteração é recomendável que não deixe de clicar no botão abaixo Salvar alterações para que seja realmente atualizado no tema.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/PHp7NAGtA6kTxyzFk2WB/image.png" alt=""><figcaption></figcaption></figure>


# Régua Fio

Em régua fio, você poderá alterar as cores dos textos do local, pare seguir o designer de sua loja

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/9mGnAhb44WBC7eaZ3tqV/image.png" alt=""><figcaption></figcaption></figure>

Lembre-se, toda alteração é recomendável que não deixe de clicar no botão abaixo Salvar alterações para que seja realmente atualizado no tema.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/Vs4Ftjxg7YlXd2KY0K0D/image.png" alt=""><figcaption></figcaption></figure>


# Banner

Em banner, disponibilizamos a opção para alterar as cores das setas e dashes(bolinhas) assim, você poderá alterar quando quiser ou quando precisar para seguir a identidade dos banners adicionados na loja.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/DOrDz83VUPCs5LWephEd/image.png" alt=""><figcaption></figcaption></figure>

Lembre-se, toda alteração é recomendável que não deixe de clicar no botão abaixo Salvar alterações para que seja realmente atualizado no tema.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/AaggBooWqjnwh3Xa81Bz/image.png" alt=""><figcaption></figcaption></figure>


# Rodapé

Nessa aba, você também poderá configurar as cores que desejar no rodapé, recomendamos sempre seguir a identidade visual de sua loja virtual, porém você poderá alterar da maneira que desejar.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/gCHXlb9TQRFjqWfKKHeu/image.png" alt=""><figcaption></figcaption></figure>

Lembre-se, toda alteração é recomendável que não deixe de clicar no botão abaixo Salvar alterações para que seja realmente atualizado no tema.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/OOFgFIciDJmGrl0B2h8d/image.png" alt=""><figcaption></figcaption></figure>


# Banners

Nessa opção, disponibilizamos algumas configurações essenciais para serem aplicada no banner principal de sua loja virtual, abaixo, vamos apresentar algumas opções onde você simplesmente irá ativar ou desativar a funcionalidade.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/w2wBK5ZEfRdzXIvcr2Ne/image.png" alt=""><figcaption></figcaption></figure>

Lembre-se, toda alteração é recomendável que não deixe de clicar no botão abaixo Salvar alterações para que seja realmente atualizado no tema.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ROt4QFPIbft2amW3dCUM/image.png" alt=""><figcaption></figcaption></figure>


# Layout

Em Layout, temos as funcionalidades de seu tema, nessa área você poderá ativar ou desativar funcionalidades em sua loja virtual para deixá-la como desejar.


# Cabeçalho e Menu

Nesta aba, podemos observar que há dois botões, sendo eles:

## Pré Header

O Pré Header é a opção onde nos possibilita exibir informações como e-mail, telefone logo acima do cabeçalho de sua loja virtual.

Para ativar essa funcionalidade basta ativa-lo apertando o botão, conforme mostramos abaixo:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/8mPRoZXoiDQwSvFeZu68/image.png" alt=""><figcaption></figcaption></figure>

## Cabeçalho Fixo na rolagem

O Cabeçalho fixo é a funcionalidade para fixa-lo no topo da loja, tornando o menu visivel em toda navegação.

Ative-lo clicando no botão na lateral, deixando - o como mostramos na figura abaixo:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/F2v9EAAxrtUv3vr8TOHi/image.png" alt=""><figcaption></figcaption></figure>

Lembre-se, toda alteração é recomendável que não deixe de clicar no botão abaixo Salvar alterações para que seja realmente atualizado no tema.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/MgR3TN0UYyT1oljjnPEs/image.png" alt=""><figcaption></figcaption></figure>


# Vitrine de produtos

Na aba vitrine de produtos, você poderá configurar a home de sua loja virtual, ativando ou desativando algumas funcionalidades pré configuradas, abaixo listamos elas:

## Exibir imagem em alta definição

Essa opção poderá afetar o tempo de carregamento de sua loja e a nota do Pagespeed, pois ao ativá-la, será carregado em sua vitrine as imagens com a mesma resolução cadastrada nos produtos.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Exibir produtos em ordem aleatória

A Opção a seguir, faz um "embaralhado" de produtos e sempre que sua loja for visitada aparecerá produtos diferentes no local.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Exibir etiquetas do produto na listagem

As etiquetas, são informações para diferenciar quando o produto é destaque, novo, lançamento ou se há desconto do produto(mostrando o percentual) e frete grátis habilitado, ela será exibida em cima da foto do produto.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Ativar o Hover na imagem do produto na vitrine

Ao ativar essa opção, sua loja virtual passará a exibir duas imagem de cada produto na capa, sendo uma delas oculta, e quando seu cliente passar o mouse em cima do produto causará um efeito de troca de imagem.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Vitrine

Nessa opção, temos 3 slides, onde você poderá escolher quais tipos de produtos aparecerão na home, sendo eles, Lançamentos, Destaques, Produtos em promoção e produtos com frete grátis habilitado, alem disso, você poderá tambem escolher entre 4 a 12 produtos para aparecer em cada slide de produtos na home.

## Primeira vitrine

Escolha entre Lançamentos, Destaques, Produtos em promoção e produtos com frete grátis a ser exibido logo no primeiro slide a ser exibido na capa de sua loja virtual junto com a quantidade de 4 a 12 posições.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/QfrwbDFMAGakSwJgL6F5/image.png" alt=""><figcaption></figcaption></figure>

## Segunda vitrine

Escolha entre Lançamentos, Destaques, Produtos em promoção e produtos com frete grátis a ser exibido na capa de sua loja virtual junto com a quantidade de 4 a 12 posições.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ypnFknoFZhgU58WvNDwG/image.png" alt=""><figcaption></figcaption></figure>

## Terceira Vitrine

Escolha entre Lançamentos, Destaques, Produtos em promoção e produtos com frete grátis a ser exibido no slide da capa de sua loja virtual junto com a quantidade de 4 a 12 posições.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/VExQeyFN9paxT9g6dtKN/image.png" alt=""><figcaption></figcaption></figure>

Após fazer as todos os ajustes neste local, lembre-se sempre de clicar no botão salvar alterações, pois, caso isso não ocorra poderá perde-las e terá que refaze-las novamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/MFwftRb8bMv1nsZF9jhK/image.png" alt=""><figcaption></figcaption></figure>


# Régua fio

A Régua Fio ou Destaque de Benefícios se trata de um slide onde você poderá informar a seu cliente quais serão as vantagens que ele encontrará ao comprar em sua loja virtual, na opção a seguir você poderá fazer o upload de uma imagem para cada vantagem e colocar alguns dizeres.

{% hint style="info" %}
Lembre-se, cuide bem do tamanho das imagens a serem adicionadas, elas influenciam muito na performance de sua loja, podendo deixa-la rápida ou lenta, por isso, a nossa dica é adicionar imagens neste local com no máximo  40x40 pixels no formato .png ou .jpg
{% endhint %}

## Exibir régua fio

Deixando a opção ativa, a régua fio aparecerá na home de sua loja virtual, logo abaixo do banner principal(fullbanner)

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Exibir régua fio dentro da categoria

Ativando esta opção, a régua fio será exibida em todas as categorias da loja virtual além da home.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Exibir botões  Direita e Esqueda

Na régua fio, podemos adicionar até 5 vantagens no local, e dependendo da resolução de tela de seu cliente, será necessário ativar o modo slide, então neste caso precisamos mostrar a seu visitante que há mais informações, por isso, adicionamos a opção de poder ativar ou desativar a funcionalidade para mostrar as flechas direita e esqueda, o mesmo ocorre com os Dots(dashes ou bolinhas), você pode ativar tanto um quanto o outro, ou as duas opções.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Seguindo logo abaixo temos a funcionalidade do upload do icone(imagem) da vantagem título principal e texto secundário.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/YyrOKvM3UvguJ4YjAkSx/image.png" alt=""><figcaption></figcaption></figure>

Para fazer o upload do icone(imagem) basta arrasta-la para o local com quadrado tracejado ou clicar sobre ele para que possa procurar a imagem em seu computador.

{% hint style="info" %}
Lembre-se, cuide bem do tamanho das imagens a serem adicionadas, elas influenciam muito na performance de sua loja, podendo deixa-la rápida ou lenta, por isso, a nossa dica é adicionar imagens neste local com no máximo  40x40 pixels no formato .png ou .jpg
{% endhint %}

Após fazer as todos os ajustes neste local, lembre-se sempre de clicar no botão salvar alterações, pois, caso isso não ocorra poderá perde-las e terá que refaze-las novamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/JNklzhQexykWB7NSc2NU/image.png" alt=""><figcaption></figcaption></figure>


# LGPD

## Como funciona?

{% hint style="info" %}
Na prática, trata-se da transparência dos e-commerces em dizer para as pessoas que seus dados estão sendo armazenados, e elas deverão ser informadas se os dados serão usados para geração de contatos, newsletters, base estatística etc.

Se quiser se aprofundar no assunto, aconselhamos realizar uma pesquisa nos buscadores ou consultar um advogado especialista no assunto para que possa entender melhor sobre a Lei.
{% endhint %}

## Exibir informação de LGPD

Ativando esta funcionalidade, sua loja passará a exibir no rodapé, um aviso de cookies.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Abaixo, deixamos um campo texto para que possa personalizar o texto da forma que desejar para exibição.

Após fazer as todos os ajustes neste local, lembre-se sempre de clicar no botão salvar alterações, pois, caso isso não ocorra poderá perde-las e terá que refaze-las novamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/dAaZIkKZBTyEvhKx8iJ0/image.png" alt=""><figcaption></figcaption></figure>


# Slide de Marcas

A Opção a seguir, trata-se de um slide onde você poderá mostrar a seus clientes, quais as marcas que você trabalha em sua loja virtual através da logo da marca, além de tambem poder colocar o link já com os produtos filtrados com a marca dentro de sua loja, facilitando assim para o seu cliente buscar pelo produto de sua marca preferida.

A opção conta com 12 posições, ou seja, vocÊ poderá adicionar até 12 marcas ao slide.

## Exibir slide de marcas

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Adicionando uma marca ao slide

Abaixo, exibimos uma imagem do ambiente, para poder cadastrar uma marca, basta fazer o upload da imagem, clicando em Enviar ou arraste a imagem para dentro deste quadrado tracejado, posteriormente vocÊ poderia adicionar um link relacionado com a marca.

Uma configuração legal seria você criar categorias de marca e posteriormente colocar o link neste local.

Caso não queira informar link, não há problemas, é um item opcional e poderá deixar em branco.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/T6kYua11gxQ4fEbZZbfw/image.png" alt=""><figcaption></figcaption></figure>

Após fazer as todos os ajustes neste local, lembre-se sempre de clicar no botão salvar alterações, pois, caso isso não ocorra poderá perde-las e terá que refaze-las novamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/RvDg13HcCmXudtCns6Rd/image.png" alt=""><figcaption></figcaption></figure>


# Notícias

Na aba notícias, você poderá habilitar um modulo de slide para que possa mostrar as 3 ultimas notícias adicionadas no blog da Tray, caso não saiba como alimentar o blog consideramos consultar a base de [conhecimentos da Plataforma](https://basedeconhecimento.tray.com.br/)&#x20;

Já em nosso editor do tema, você terá apenas uma opção de ativar ou desativar a funcionalidade.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.


# Depoimentos

Em depoimentos, você poderá alimentar com o feedback de seus clientes para mostrar a seus visitantes e clientes o quanto sua loja virtual é confiável.

Nessa funcionalidade, é possível adicionar 12 depoimentos com fotos, nome e o depoimento do cliente.

## Como ativar os depoimentos

Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Como adicionar depoimentos

Para alimentar o local é bem simples, basta fazer o upload de uma foto do cliente(caso tenha), nome e depoimento em formato texto.

{% hint style="info" %}
Lembre-se, cuide bem do tamanho das imagens a serem adicionadas, elas influenciam muito na performance de sua loja, podendo deixa-la rápida ou lenta, por isso, a nossa dica é adicionar imagens neste local com no máximo  40x40 pixels no formato .png ou .jpg
{% endhint %}

Abaixo mostramos   a imagem de como é o local onde irá alimentar com os depoimentos.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/JfQ9WGUqOOHahxUvAdR3/image.png" alt=""><figcaption></figcaption></figure>

> Após fazer as todos os ajustes neste local, lembre-se sempre de clicar no botão salvar alterações, pois, caso isso não ocorra poderá perde-las e terá que refaze-las novamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/qiOtp93L9FVosADFtYiU/image.png" alt=""><figcaption></figcaption></figure>


# Newsletter

A Opção newsletter basicamente trata-se do local junto ao rodapé onde você poderia mostrar ou não o formulario de inserção do nome e e-maildo visitante para que ele possa receber novidades e promoções  de sua loja virtual.

Se quiser saber mais informações sobre essa funcionalidade em sua loja virtual, basta fazer uma consulta na [base de conhecimeto](https://basedeconhecimento.tray.com.br/) da plataforma Tray.

## Ativando ou desativando a area de Newsletter

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Após fazer as todos os ajustes neste local, lembre-se sempre de clicar no botão salvar alterações, pois, caso isso não ocorra poderá perde-las e terá que refaze-las novamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/H1FaNRkWTjJEWs1tk7xv/image.png" alt=""><figcaption></figcaption></figure>


# Categorias e busca

Na funcionalidade de categorias e busca, há algumas opções bem interessantes, que poderá ser usado em sua loja virtual.

## Exibir filtro lateral

Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## O que é o filtro lateral?

O filtro basicamente é um facilitador de busca onde é apresentado ao cliente algumas opções de filtragem como por exemplo o preço de R$ 0,00 até R$ 99,00 ou seja, o filtro irá buscar apenas produtos nessa faixa de preço, dentre outras opções interessantes que facilitam para o cliente a encontrar produtos de acordo com sua necessidade.

Abaixo mostramos uma imagem de como é o filtro:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/D2j6ZaoWi5RhIhINKrzE/image.png" alt=""><figcaption></figcaption></figure>

Esse filtro pode ser configurado com mais opções, pois é dinâmico, para mais informações sobre o filtro, você poderá consultar a [base de conhecimentos](https://basedeconhecimento.tray.com.br/) da Plataforma Tray, pois, a funcionalidade é nativa da plataforma.

## Quantidade de colunas por linha

A funcionalidade de Quantidade de colunas por linha foi criada por nós para que vocÊ possa ter a opção de quantos produtos você deseja exibir em cada linha, ou seja, a listagem de categorias é dividida em linhas e colunas, por padrão é exibido 3 colunas em cada linha, deixamos pré configurado mais duas opções, sendo elas para exibir 2 produtos e 4 produtos por linha.

Para configurar basta você acessar o menu dropdown existente no local e escolher a quantidade de colunas que deseja, conforme a imagem abaixo:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/MZKxYIXlq75wb7Osf4xh/image.png" alt=""><figcaption></figcaption></figure>

## Ativar rolagem infinita

Ao ativar esta função, não será exibida a numeração de paginação na página de categoria e busca, a paginação funcionará automaticamente conforme a rolagem.

Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

## Salve as alterações

Após fazer as todos os ajustes neste local, lembre-se sempre de clicar no botão salvar alterações, pois, caso isso não ocorra poderá perde-las e terá que refaze-las novamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/BziT8GR1ty0l01eMGzbo/image.png" alt=""><figcaption></figcaption></figure>


# Página do produto

Nessa aba, encontramos diversas funcionalidades que podem agregar muito na exibição dos detalhes de produto de sua loja virtual, são elas:

### Exibir área de avaliação de produtos

Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Quando ativa exibirá a funcionalidade a seguir:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/Di8d1UB4nXDwDdd7uFBc/image.png" alt=""><figcaption></figcaption></figure>

### Exibir tabela de informações adicionais

Se ativo, a tabela de informações adicionais do produto. Obs, não deixar de informar dentro do produto, cada informação adicional.

* Exibir Estoque
* Exibir tempo de garantia
* Exibir disponibilidade
* Exibir Marca
* Exibir Referencia
* Exibir modelo
* Exibir código de barras
* Exibir peso

Cada uma das opções acima poderá ser exibida ou ocultada individualmente através do botão de ativar e desativar.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Quando ativa exibirá a funcionalidade abaixo:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/1aEPaX3GGbbjo2XCcxB1/image.png" alt=""><figcaption></figcaption></figure>

### Zoom na imagem do produto

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Ao ativar essa funcionalidade, será habiltada o hover para possibilitar ao cliente passar o mouse em cima da foto, proporcionando um zoom automatico para ele, assim, facilitando visualizar detalhes.

### Exibir tags

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

As tags, basicamente são informações úteis para seu cliente saber se o produto está com frete grátis, se é lançamento, destaque ou qual o valor do desconto em percentual está sendo aplicado ao produto em questão.

#### Tag Extra

A Tag de Selo Extra, poderá ser usado de diversas formas, por exemplo, para indicar produtos que farão parte da Black Friday.

Ativando a tag de selo extra, você poderá informar um texto pequeno que será exibido junto do produto.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Além de ativar em nosso Editor do tema, você terá que definir dentro do produto que ele deverá exibir o selo extra, para ativar dentro do produto basta selecionar a opção **Exibir selo adicional no produto** e salvar o produto.

Após o salvamente, é so aguardar que o selo aparecerá no produto configurado.

### Exibir calculo de frete

O Calculo de frete na página de produto facilita para o visitante / cliente, consultar o valor logístico para envio do produto sem a necessidade de adicionar o produto ao carrinho de compras, habilitar essa funcionalidade trás comodidade ao cliente, mas caso deseja desabilitar é possível através do botão.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

A opção de calculo de frete fica localizado juntamente a página do produto visitado da seguinte forma:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/FjsgKmEYI76OUXOvD2M3/image.png" alt=""><figcaption></figcaption></figure>

### Botão de Whatsapp na págna de produto

O botão de whatsapp na página de produto é um componente interessante para que o cliente possa tirar dúvidas sobre o produto em que tem interesse.

Basicamente quando o cliente clicar no botão de whatsapp dentro do produto em que está visitando, ele será redirecionado para o aplicativo com as informações básicas do produto para tirar duvidas com o lojista.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Depois de ativo o botão do whatsapp aparecerá da seguinte maneira:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/7c4bZDrRthuvaJ1xF0YT/image.png" alt=""><figcaption></figcaption></figure>

### Exibir produtos relacionados

Ao ativar a opção de exibir produtos relacionados, você ativará um slide de produtos que deverá ser pré configurado dentro da plataforma tray primeiramente.

Caso deseja aprender como configurar os produtos relacionados, consulte a [base de conhecimento](https://basedeconhecimento.tray.com.br/hc/pt-br) tray, popis trata-se de uma funcionalidade nativa da Plataforma.

Além disso, é necessário ativar a funcionalidade em nosso painel.

> Deixando o botão dessa maneira <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/e9nNgmmHvfGSdqZCVnKL/image.png" alt="" data-size="line"> você estará deixando a opção habilitada, caso o botão esteja <img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/ssI1k7zkmLcP0kTH2UdP/image.png" alt="" data-size="line"> dessa outra forma, a opção está desabilitada e a funcionalidade não irá funcionar.

Quando configurado corretamente e ativado, a loja passará a mostrar no produto visitado, vários outros produtos relacionados, conforme mostramos abaixo:

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/rI4pZIKzr7hp6qu7tAk9/image.png" alt=""><figcaption></figcaption></figure>

## Salvando as alterações

Após fazer as todos os ajustes neste local, lembre-se sempre de clicar no botão salvar alterações, pois, caso isso não ocorra poderá perde-las e terá que refaze-las novamente.

<figure><img src="https://content.gitbook.com/content/Z4r3plY0eHeW1iqIle6C/blobs/5Yvb5HtNiEYl5FM3WgBk/image.png" alt=""><figcaption></figcaption></figure>


# Tamanho da imagem na vitrine

Nosso tema sempre utiliza a configuração padrão da Tray chamada Thumb do produto.&#x20;

A plataforma possui quatro tamanhos de thumbs para serem utilizados pelo tema e o que nós utilizamos na listagem é a **thumb 180**.&#x20;

Porém para deixar as imagens dos produtos  maiores é necessário pedir o aumento da thumb 180 para a Tray.

{% hint style="info" %}
Cuidado, ao carregar imagens maiores na loja, poderá acarretar em sobrecarga, perdendo assim pontos de performance na loja, por isso, nós aconselhamos que use essa opção com cautela.
{% endhint %}

Para solicitar o aumento das thumbs é necessário entrar em contato com o suporte da propria Plataforma Tray através deste link [suporte](https://basedeconhecimento.tray.com.br/hc/pt-br/articles/6743727654171-Como-entrar-em-contato-com-o-atendimento-da-Tray) e siga as orientações da plataforma.


# Textos e informações

Todos os textos de informações presentes na loja virtual é configurado exclusivamente dentro de nosso painel de edição do tema na aba [minha loja](/painel-do-tema/minha-loja).


# Páginas da Loja

Em relação as páginas institucionais da loja virtual, como quem somos, Segurança, como comprar, pagamentos e envio, politicas de privacidade e entre outras, são configuradas a partir do menu Minha loja ->Páginas da loja dentro da Plataforma Tray.

Você poderá editar ou criar novas páginas neste local.

Para mais informações consulte a [base de conhecimento](https://basedeconhecimento.tray.com.br/) da Plataforma Tray.


# Formas de Pagamento

As formas de pagamento, são essenciais para sua loja virtual poder vender online, na Plataforma contamos um um ambiente seguro e extremamente completo para utilização.

Nele você encontra PIX, Cartão de crédito, Boleto, Transferência online.

Para Habilitar e configurar os meios de pagamento em sua loja virtual, vocÊ precisará ir até Configurações -> Aba Pagamento -> Geral.

Caso necessite de mais informações sobre as configurações, sugerimos que acesse a [base de conhecimento](https://basedeconhecimento.tray.com.br/) de Plataforma para entender melhor cada detalhe e cada configuração disponível.


# Onde editar os banners

Os banners são funcionalidades de marketing para sua loja virtual, com eles, é possível divulgar promoções, produtos em destaque, novidades e muito mais.

Na plataforma, temos um ambiente completo para gerenciamento de banners e para utiliza-lo, basta acessar a aba marketing no menu lateral do gerenciador da plataforma, procurar por Banners  e configurar os banners que desejar.

No caso de nosso tema, utilizamos na home os seguintes tipos:

* Banner Home
* Banner Home Mobile
* Estra 1
* Extra 2
* Extra 3
* Extra 4&#x20;
* Extra 5
* Banner Rodapé

Já dentro da categoria, temos a opção do Banner título, onde é possível configurar um banner para cada categoria

para saber mais sobre como usar o gerenciador de banners pedimos que consulte a [base de conhecimento](https://basedeconhecimento.tray.com.br/) da Plataforma.

{% hint style="info" %}
As funcionalidades de tempo e efeito, são configuradas apenas dentro do nosso editor de temas, para isso, você pode consultar [aqui](/painel-do-tema/minhaloja-1)
{% endhint %}


# Dimensões

Todos os banners contém um tamanho especifico de acordo com suas posições, por isso, separamos essa aba para falar um pouco sobre elas:

#### Banner Home

Recomendamos a utilização de banners com as dimensões de 1400 X 500 pixels

#### Banner Home Mobile

Recomendamos a utilização de banners com as dimensões de 400 X 400 pixels

#### Banner Extra 1 / Extra 2 e Extra 3 - Desktop

Recomendamos a utilização de banners com as dimensões de 360 X 450 pixels

#### Banner Extra 6 / Extra 7 e Extra 8 - Mobile

Recomendamos a utilização de banners com as dimensões de 400 X 400 pixels

#### Banner Extra 4 - Desktop&#x20;

Recomendamos a utilização de banners com as dimensões de 1200 X 250 pixels

#### Banner Extra 9 - Mobile

Recomendamos a utilização de banners com as dimensões de 400 X 400 pixels

#### Banner Extra 5 - Desktop

Recomendamos a utilização de banners com as dimensões de 260 X 550 pixels

#### Banner Extra 10 - Mobile

Recomendamos a utilização de banners com as dimensões de 400 X 400 pixels

#### Banner Rodapé  - Desktop

Recomendamos a utilização de banners com as dimensões de 1200 X 300 pixels

#### Banner Rodapé - Mobile

Recomendamos a utilização de banners com as dimensões de 400 X 400 pixels

#### Banner de Categoria - Desktop

Recomendamos a utilização de banners com as dimensões de 1200 X 250 pixels

#### Banner de Categoria - Mobile

Recomendamos a utilização de banners com as dimensões de 400 X 400 pixels


# Gabarito Desktop

O Gabarito a seguir serve de orientação para que possa entender melhor cada posição de cada tipo de banner no tema.

Segue abaixo para melhor entendimento.

<figure><img src="https://1867547453-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZ4r3plY0eHeW1iqIle6C%2Fuploads%2FwbrJ4BGBQtyYUy8GeEjI%2Fmdelo.jpg?alt=media&amp;token=fc8c8449-c42b-46cf-af27-593c140b2ab7" alt=""><figcaption></figcaption></figure>


# Gabarito Mobile

O Gabarito a seguir serve de orientação para que possa entender melhor cada posição de cada tipo de banner no tema.

Segue abaixo para melhor entendimento  o esboço completo das posições de cada banner.


# Editando o código do tema

{% hint style="info" %}
Antes de qualquer alteração no código, nós recomendamos criar uma cópia de segurança antes de editar os códigos HTML e CSS do seu tema.&#x20;

A Cópia de Segurança é extremamente importante, pois, caso aconteça algum problema você poderá retornar rapidamente a um tema funcional.

Somente edite o código do seu tema se tiver conhecimentos avançados em HTML, CSS e JS.
{% endhint %}


# Certificado de Segurança - SSL

O certificado de segurança é de extrema importância para que sua loja virtual possa ter um ambiente criptografado e de confiança para seus clientes.

A Tray disponibiliza a compra do certificado ssl através do painel, para mais informações recomendamos que entre em contato diretamente com o suporte da plataforma.


# Obrigado!

Primeiramente agradecemos a compra e confiança empregada a nós, isso nos motiva cada vez mais a continuar oferecendo o melhor serviço para vocês.

Desejamos a você muito sucesso em sua jornada ao e-commerce, um grande abraço de toda equipe.

Woo Temas.