Klaviyo - Integração/Configuração

Neste artigo, aprenderá dois métodos diferentes que explicam como enviar dados linguísticos para o Klaviyo

1. Através de um formulário de inscrição no Klaviyo

Este guia irá adicionar uma propriedade extra chamada lang a cada utilizador que se inscreve através de um formulário Klaviyo no seu sítio Web. Em seguida, cria segmentos no Klaviyo para lhes enviar e-mails em diferentes idiomas.

Primeiro, localize o ID HTML do formulário de inscrição do Klaviyo na sua página (normalmente#klaviyo-form-numbers). O seletor para esse formulário é então #klaviyo-form-URs6Bv

Inclua o seguinte snippet no seu código HTML. Certifique-se de que o inclui depois de ambos Weglot e KlaviyoSubscribe estão incluídos. Certifique-se de que substitui #email_subscribe com o seletor real no formulário.

Se utilizar o Weglot com a aplicação Shopify, adicione também o snippet Weglot antes do script Klaviyo

<script type="text/javascript" src="https://cdn.weglot.com/weglot.min.js"></script>
<script>
    Weglot.initialize({
        api_key: 'YOUR_API_KEY'
    });
</script>

Aqui está o script para ligar o Klaviyo:

<script>
 function identifyLanguageToKlaviyo(lang) {
      setTimeout(function(){
        const klaviyoForm = document.querySelector('form[data-testid="klaviyo-form-URs6Bv"]');
        const langAttribute = document.querySelector('html').getAttribute('lang');
        if(klaviyoForm){
          console.log("push");
            klaviyo.push(['identify', { 'lang': langAttribute }]);
        }
      }, 7000);
    }
  
  
  identifyLanguageToKlaviyo(Weglot.getCurrentLang());
  Weglot.on('languageChanged', identifyLanguageToKlaviyo)
  Weglot.on("switchersReady", identifyLanguageToKlaviyo);
</script>

Este código obtém o idioma que o visitante utiliza quando submete o formulário Klaviyo e envia a etiqueta de idioma para o seu plugin Klaviyo.

Isto significa que, quando um visitante submete o formulário da sua newsletter Klaviyo, esse visitante deve ser criado no seu plugin Klaviyo com uma etiqueta lang relacionada com a língua utilizada no sítio Web quando submeteu o formulário.

Note-se que a etiqueta só pode ser adicionada a novos clientes registados e não pode ser aplicada a clientes que se inscreveram antes de o script ter sido integrado.

Se quiser seguir o mesmo método, mas para vários formulários Klaviyo, pode utilizar o código abaixo. Só tem de editar o ID do formulário dentro do código (nesta explicação, os IDs são #klaviyo-form-RTbEav, #klaviyo-form-UJyYv5e #klaviyo-form-YjxCKV):

<script>
  function identifyLanguageToKlaviyo(lang) {
    setTimeout(function () {
      const klaviyoForms = document.querySelectorAll('form[data-testid="klaviyo-form-RTbEav"], form[data-testid="klaviyo-form-UJyYv5"], form[data-testid="klaviyo-form-YjxCKV"]');
      const langAttribute = document.querySelector('html').getAttribute('lang');
      if (klaviyoForms && typeof klaviyo !== "undefined") {
        klaviyoForms.forEach(form => {
          console.log("push");
          klaviyo.push(['identify', { 'lang': langAttribute }]);
        });
      }
    }, 7000);
  }

  identifyLanguageToKlaviyo(Weglot.getCurrentLang());
  Weglot.on('languageChanged', identifyLanguageToKlaviyo);
  Weglot.on("switchersReady", identifyLanguageToKlaviyo);
</script>

2. Através do Snippet de Rastreio Web da Klaviyo

• Certifique-se de que já está a utilizar o Klaviyo Web Tracking Snippet no seu sítio Web.
• Inclua o seguinte código após o código de Web Tracking do Klaviyo e o código do switcher do Weglot:

<script>
(function() {
  var identifyLanguageToKlaviyo = function(lang) {
    var _learnq = window._learnq || [];
    _learnq.push(['identify', {
      $lang: lang
    }]);
  }
  identifyLanguageToKlaviyo(Weglot.getCurrentLang())
  Weglot.on('languageChanged', identifyLanguageToKlaviyo)
})()
</script>