Gatilhos personalizados da loja virtual

Os gatilhos integrados da loja virtual abrangem os eventos relatados pelo Shopify. Um gatilho personalizado da loja virtual abrange tudo o mais que ocorre em sua loja virtual: basta publicar um evento a partir do seu tema com uma linha de JavaScript, e ele se torna um gatilho que você pode utilizar no Shopify Flow.

O exemplo mais claro é a gaveta do carrinho. O evento de visualização do carrinho de Shopify é acionado na página /cart, e a maioria dos temas modernos nunca navega até lá - em vez disso, eles abrem a gaveta por meio de um efeito deslizante. Shopify não reporta nada, portanto, nenhum aplicativo consegue detectá-lo. Publicar seu próprio evento quando a gaveta se abre resolve essa lacuna.

Outras finalidades para as quais as lojas o utilizam:

• Uma adição à lista de desejos ou um clique em “notificar-me”, nenhuma das quais é relatada pelo site Shopify.
• A abertura de um guia de tamanhos ou de uma política de devoluções, como indicação sobre um produto.
• Uma alteração na variante do seletor, que não constitui uma nova visualização da página (consulte Acionadores de vitrine).
• Qualquer informação que seu tema ou um aplicativo de terceiros já conheça e que o Shopify não conheça.

Como funciona

1. Crie o gatilho no aplicativo e atribua-lhe um nome de evento, por exemplo, cart_drawer_opened. Assim como qualquer gatilho da loja virtual, ele requer acesso ao Comportamento da Loja Virtual, concedido uma única vez na página “Permissões”.
2. Copie o trecho de uma linha que o aplicativo exibe e cole-o no seu tema, no local onde isso ocorre. Caso não tenha certeza do que colar ou onde, o site Gerar código de gatilho com IA gera o trecho para o seu tema a partir de uma descrição em linguagem simples.
3. Escreva uma transformação caso deseje filtrar ou reformular o que será enviado, ou deixe em branco para encaminhar tudo.
4. Ative-o e, em seguida, adicione o “Gatilho de loja virtual personalizada” no Shopify Flow e crie uma ramificação com base no nome do evento.

O trecho de código representa toda a integração no lado do tema:

Shopify.analytics.publish("cart_drawer_opened", {
  // anything you want the Flow to receive
  itemCount: 3,
  total: "129.90"
});

Nome do evento

O nome do evento é o que determina a ramificação do seu fluxo de trabalho no Shopify Flow; portanto, escolha algo legível e não o altere mais depois que os fluxos de trabalho começarem a utilizá-lo.

Os nomes podem conter letras, números, sublinhados e hífens, devem começar com uma letra ou um número e podem ter até 64 caracteres. O aplicativo transforma o que você digita em um “slug”, de modo que Cart drawer opened se torna cart_drawer_opened.

O nome está associado a um namespace interno, de modo que nunca poderá entrar em conflito com um evento do tipo Shopify ou com um gatilho personalizado de webhook com o mesmo nome.

Filtragem e remodelação

Os dados que o senhor passa como segundo argumento chegam ao Shopify Flow como o parâmetro output do gatilho. Se isso for tudo o que o senhor precisa, está tudo pronto.

Quando desejar acionar apenas em alguns casos, ou enviar campos diferentes daqueles publicados pelo tema, crie uma transformação - o mesmo módulo JavaScript utilizado pelo Gatilhos personalizados. Retorne um objeto para acionar, retorne null para ignorar:

export async function transform(payload, topic, shop, ctx) {
  // Anything you published is on `payload`.
  if ((payload.itemCount || 0) < 2) return null;

  return {
    itemCount: payload.itemCount,
    total: payload.total,
    // Present only when the shopper is signed in.
    customerId: payload.customerId,
  };
}

Como utilizá-lo no site Shopify Flow

Cada gatilho “Custom Storefront Trigger” é exibido no Shopify Flow com o mesmo nome: “Custom Storefront Trigger”. Adicione-o a um fluxo de trabalho e, em seguida, defina uma condição para que o “eventName” seja igual ao nome que você escolheu.

É isso que permite que um gatilho do Shopify Flow acione todos os eventos da sua loja virtual. O gatilho também contém o nome que o senhor atribuiu a ele no aplicativo e a saída da sua transformação.

Ele é deliberadamente distinto do “Gatilho personalizado”, que dá suporte ao Gatilhos personalizados baseado em webhooks. Os dois diferem de uma forma que vale a pena conhecer: um “Gatilho personalizado” de webhook é executado em nossos servidores e é confiável, enquanto um evento de loja virtual depende de o navegador do comprador se conectar ao nosso sistema e do consentimento dele para o uso de análises.

O que não deve ser enviado

O segundo argumento da função publish está inteiramente sob seu controle, o que significa que é de sua responsabilidade evitar que dados pessoais sejam incluídos nele.

Envie identificadores e dados: IDs de produtos e variantes, quantidades, preços e o nome do que ocorreu. O ID do cliente conectado é adicionado automaticamente quando houver um, portanto, o senhor nunca precisará fornecê-lo manualmente.

Não envie nomes, endereços de e-mail, números de telefone ou endereços postais. Seu fluxo de trabalho pode consultar qualquer uma dessas informações a partir do ID do cliente no Shopify Flow; portanto, não há vantagem alguma em incluí-las em um evento da loja virtual, e isso transforma um evento de análise em um evento de dados pessoais.

Próximos passos

• Acionadores de vitrine - os gatilhos integrados da loja virtual e como o pixel funciona.
• Gerar código de gatilho com IA - Deixe que a IA redija o trecho do tema ou a transformação para o(a) senhor(a).
• Gatilhos personalizados - a mesma ideia para eventos de webhook do Shopify, com confiabilidade do lado do servidor.
• Planos e uso - o que se considera um evento.