Ícones no menu
Com esta nova funcionalidade será possível adicionar ícones ilustrativos às categorias da sua Loja Integrada.
Passo 01: Escolhendo os ícones no site Flaticon
Para os ícones, usaremos o site Flaticon, que possui milhares de ícones gratuitos. Acesse o site, clicando aqui.
No site Flaticon, busque por um ícone que represente uma categoria da sua loja.
Exemplo:
1.1: Clique em um dos ícones ícones da sua escolha.
Exemplo:
1.2: No lado esquerdo, clique no seletor de cores, para edite a cor do seu ícone. Recomendamos utilizar uma cor similar ou igual a cor do título/texto do menu da sua loja.
Exemplo:
1.4: Agora que escolhemos as cores, precisamos baixar nosso ícone para nosso PC. Para baixar, clique em BAIXAR, em seguida em PNG > 64px (veja na imagem de exemplo), que será o tamanho da nossa imagem. Pronto! Você já tem um ícone para seu menu, mas ainda não acabou, no passo 2, iremos fazer upload deste arquivo, na Loja Integrada.
Passo 02: Fazendo upload na Loja Integrada
Agora que já temos nosso ícone baixado em nosso computador, precisamos fazer o Upload dessa ícone (imagem) na Loja Integrada, para que possamos utiliza-lo.
Para fazer upload na sua Loja Integrada, clique aqui. Em seguida, selecione a imagem, e clique em Enviar arquivo. Pronto! Upload feito.
Instalando o código na sua Loja Integrada
Passo 03: vá em Configurações > Incluir código HTML.
Preencha os campos desta forma:
Descrição: Ícones no menu
Local Publicação: Rodapé
Página Publicação: Todas
Tipo: JavaScript
iconMenu = [ { indice: seuindice, icone: `link de sua imagem`, }, ];
✅ Pronto!
Clique em salvar e aguarde 15min ou adicione um produto ao carrinho e atualize a página.
Não funcionou? Veja os principais motivos
1. Após instalar, você aguardou 15min ou adicionou um produto ao carrinho para atualizar a loja.
2. Seguiu corretamente todos os passos citados acima? Por favor, tente revisar.
3. Utilizou na instalação do código o TIPO: JavaScript?
4. Compare seu código com o código listado acima, encontrou alguma divergência?
Adicionando mais de um ícone
Deve adicionar os códigos ativadores logo abaixo um do outro, copiando o trecho incluindo as chaves:
{
índice: seuindice,
ícone: `link de sua imagem`,
},
Para que fique semelhante ao modelo abaixo:
iconMenu = [ { indice: seuindice, icone: `link de sua imagem`, }, { indice: seuindice, icone: `link de sua imagem`, }, ];