Como instalar o agente no Shopify
Onde inserir o código no tema do Shopify, como o agente lê o catálogo da loja, o que fazer com o carrinho e o pagamento e como verificar a instalação.
O Shopify já tem um catálogo em formato legível por máquina, por isso o agente recolhe os produtos com maior precisão do que em qualquer outro lugar: os preços, variantes, disponibilidade e fotografias vêm diretamente da loja.
Passo 1. Insira o código no tema#
- No painel de administração do Shopify, abra Loja online → Temas.
- No tema ativo, clique em … → Editar código.
- Na lista de ficheiros, encontre
layout/theme.liquid. - Insira a linha de código da sua área de cliente imediatamente antes da etiqueta de fecho
</body>. - Guardar.
Alternativa sem editar o tema: Loja online → Preferências → Código personalizado ou qualquer aplicação para inserir scripts. O resultado é o mesmo.
<!-- Commerce Agents -->
<script src="https://comag.vibevox.pro/widget.js" data-slug="o-seu-slug" async></script>
</body>
</html>Obtenha a linha exata na sua área de cliente no botão «Copiar código»: já contém o endereço da sua loja online.
Passo 2. Crie o catálogo#
Nas definições, indique o endereço da loja e inicie a análise. O rastreador do Shopify lê os dados estruturados dos produtos: nome, preço, moeda, disponibilidade, descrição e fotografias. As variantes (tamanhos, cores) aparecem na ficha do produto como características.
Uma nova análise atualiza os preços e a disponibilidade. Execute-a após grandes alterações no sortido: o agente não se liga diretamente à sua base de dados, mas trabalha com o catálogo compilado.
Passo 3. Deixe o pagamento a cargo da loja#
No Shopify, não é necessário ativar o pagamento no chat. O esquema correto é:
- Nas definições da loja, indique o link para o carrinho — normalmente
https://o-seu-dominio/cart. - O agente seleciona o produto, mostra a ficha e, através de um botão, direciona o comprador para o carrinho do Shopify.
- O processo de finalização da compra e pagamento segue o caminho habitual, com todas as suas regras de envio e impostos.
Para ver quais diálogos resultam em compra, insira o fragmento do pixel de compra na página de agradecimento. No Shopify, isto é Definições → Finalização da compra → Página de estado da encomenda → Scripts adicionais. O fragmento, com a substituição do número da encomenda e do valor, encontra-se na sua área de cliente, na secção «Widget e link».
O produto entra no carrinho sem interromper a conversa#
Aqui, o Shopify destaca-se das outras plataformas. O agente mostra fichas de produtos com fotografia, preço e um botão, mas o botão não apenas leva à página — ele adiciona o produto ao carrinho da loja.
Funciona da seguinte forma: o link do produto Shopify contém um identificador de variante, o agente transmite-o para o seu próprio carrinho através da interface padrão /cart/add.js. A página não recarrega, o diálogo não é interrompido, o comprador vê uma breve confirmação e continua a escolher. O produto já está no carrinho do Shopify — com todas as suas regras de descontos, impostos e envio.
Se não houver uma variante no link, o agente abre a ficha do produto, e o comprador adiciona-o por si mesmo. Nada se quebra, é apenas um clique a mais.
Quando o cliente está pronto, o botão «Ir para a finalização da compra» leva a /cart, onde tudo já está preparado. A seguir — o checkout normal do Shopify.
E, separadamente, sobre o contexto: o agente lê os dados estruturados da página onde o chat está aberto. O comprador vê um produto específico e pergunta «está disponível no tamanho L?» — o agente entende do que se trata, sem precisar perguntar novamente.
- Abra a loja em modo incógnito, aguarde pelo botão do chat.
- Pergunte sobre um produto pelo nome — deve aparecer uma ficha de produto com o preço.
- Clique em «Ir para a finalização da compra» — deve abrir o carrinho do Shopify.
- Faça uma encomenda de teste e certifique-se de que a compra foi registada em «Pedidos».
Chat em sintonia com a loja#
O tema do Shopify define o ambiente de toda a loja, e o chat não deve destoar. Nas definições do widget, existem três opções: claro, escuro e «como o do visitante», que segue as definições do dispositivo do comprador.
Para lojas com tema escuro, defina o escuro de forma fixa, para as claras — o claro. A cor de destaque dos botões permanece a sua em ambos os casos.
Passo 4. Verifique#
Problemas comuns#
O widget desapareceu após a mudança de tema. O código reside no ficheiro do tema. Mudar ou atualizar o tema apaga a alteração — insira o código novamente ou use o Código personalizado, que não depende do tema.
O catálogo não foi totalmente compilado. O rastreamento recolhe produtos de páginas públicas. Os produtos ocultos do catálogo e os rascunhos não são incluídos, o que é correto.
Os preços no catálogo estão desatualizados. Execute a análise do site novamente, irá atualizar os preços e a disponibilidade nas fichas de produto existentes.
O widget está em conflito com a aplicação de chat. Mantenha apenas um chat: duas janelas no mesmo canto interferem entre si e confundem o comprador.
Perguntas frequentes#
É necessária uma aplicação da Shopify App Store?#
Não. O agente conecta-se com uma única linha de código, não é necessário instalar uma aplicação.
O agente consegue mostrar variantes de produtos?#
Sim, as variantes aparecem na ficha do produto como características: tamanho, cor, volume. O comprador faz a escolha da variante específica no carrinho do Shopify.
Como lidar com várias moedas?#
O agente mostra os preços na moeda do catálogo, que é determinada durante o rastreamento. A funcionalidade de várias moedas do Shopify funciona posteriormente, no carrinho e no pagamento.
O agente saberá sobre os stocks?#
A disponibilidade é recolhida no momento da análise. Para produtos que esgotam frequentemente, execute a análise com mais regularidade ou adicione uma linha às condições indicando que a disponibilidade é confirmada no momento da finalização da compra.
O widget afeta a velocidade da loja?#
O script carrega de forma assíncrona e não bloqueia a renderização. Isto praticamente não afeta as métricas do Core Web Vitals.