Precisa de ajuda?

→
KIT VERSÃO BETA
 
Este tutorial é destinado aos lojistas que não está apresentando os produtos do KIT na página de produto na loja virtual.

Exemplo de exibição:

1.png



Para as lojas que não estão apresentando os produtos na página de produto, deverá ser realizado uma das duas opções abaixo:
Qualquer problema gerado em sua loja, você poderá voltar seu layout para uma versão anterior. Veja abaixo como realizar.
 



MÉTODO MANUAL
 
Atenção: neste método é necessário ter conhecimento em HTML e CSS, caso não tenha, informe seu responsável pelo design da loja para realizar a alteração.
Passo 1- Acesso ao menu: Minha Loja > Design da loja


6.gif


Passo 2- Duplique o seu tema publicado


7.gif


 
Passo 3 - Acesse a página de Editar HTML do tema que acabou de duplicar.



8.gif


Passo 4 - Clique no menu "pages" e em seguida em "product.html"


9.gif




Passo 5 - Na lateral direita irá abrir o editor de código html.

Localize o texto
{{ productHelper.variants() }}
e insira logo abaixo o código
{{ productHelper.kit() }}


Veja o exemplo:

10.gif

 
 
Passo 6 - Visual padrão: Caso queira aplicar um visual padrão para o seu KIT, é possível adicionar o CSS disponibilizado pela Tray.
 
Somente indicamos adicionar o CSS padrão da Tray caso seu layout não seja personalizado, visto que o CSS padrão poderá não seguir o visual de sua loja.
 
Você poderá verificar com seu design um visual CSS personalizado para sua loja.
 
Caso não deseje adicionar o visual padrão da Tray, por favor, vá para o passo 7 e não realize este passo 6
 
Passo 1: Faça o download do arquivo kit.css clicando aqui
 
Passo 2: Na página de edição do tema clique no botão upload e selecione a opção CSS
 
Passo 3: Selecione o arquivo kit.css que fez o download
 
Exemplo:
 
 
20.gif
 
 
Passo 4: Acesse o caminho "layouts > default.html" e cole o código abaixo:
 
<link rel="stylesheet" href="{{ asset('css/kit.css') }}" type="text/css">
 
Exemplo:
 
 
13.gif
 
 
 
Passo 7 - Acesse sua loja para visualizar as alterações e identificar se não ocorreu nenhum problema em sua alteração.

Na parte superior da página (logo acima do editor) contém um botão de visualizar


14.gif


Navegue por sua loja, acesse a página de produto e veja se não contém nenhum item desconfigurado e acesse um produto kit.


Passo 8 - Com todas as configurações realizadas com sucesso e seu layout não tenha apresentado problema, clique em publicar tema


15.png

 
 
Passo 9 - Caso todas as configurações estejam corretas, o seu kit deverá apresentar na página de produtos como o exemplo abaixo:

16.png


Algumas lojas contém personalização CSS personalizados e poderá ser exibido o kit com um visual diferente. Para personalizar a exibição do kit basta conversar com seu design para realizar a alteração



Atenção: Caso ocorra algum problema em sua loja referente a alteração do layout realizada veja o item "voltando o meu layout antigo":

 
 
 

MÉTODO AUTOMÁTICO (disponível após 10/10/2017 na finalização da etapa 5 )
 
Atenção: Se já realizou o método automático e não apresentou o kit, faça o método manual.
 
1- Acesso ao menu: Minha Loja > Design da loja

2.gif


2- Em seu tema publicado, clique no link "Iniciar instalação do tema" e instale a nova versão de seu tema.

ATENÇÃO: Caso em sua loja não apresente o link de "iniciar a instalação do tema" ou você já realizou este processo e o kit continua não apresentando, será necessário realizar a alteração manualmente. Siga para o processo manual.


3.gif

 
 
3- Após instalar o tema automaticamente, você deve verificar se suas configurações estão corretas e então publicar o tema atualizado.


4.gif



4- Caso todas as configurações tenham sido realizadas com sucesso, o seu kit deverá apresentar na página de produtos como o exemplo abaixo:


5.png



Algumas lojas contém personalização CSS personalizados e poderá ser exibido o kit com um visual diferente. Para personalizar a exibição do kit basta conversar com seu design para realizar a alteração


Atenção: Caso ocorra algum problema em sua loja referente a alteração do layout realizada veja o item "voltando o meu layout antigo":
 
 
 
 

VOLTANDO O LAYOUT ANTES DA ALTERAÇÃO

Em ambos os processos (manual ou automático) o sistema Tray irá gerar uma duplicação (cópia) do seu tema atual para que você possa alterar e manter seu tema anterior com os códigos sem qualquer alteração. Dessa forma é possível encontrar seu layout anterior na listagem de temas e publicar o mesmo novamente.

Exemplo:


17.gif

 
Tray 
Tem mais dúvidas? Envie uma solicitação

Comentários

    Powered by Zendesk