Our Klaviyo Tips

Integrating Weglot with Klaviyo

Intégrer Weglot avec Klaviyo

Do you want to personalize your marketing communications based on your customers' preferred language? Does your international audience deserve messages in their native language? The integration between Klaviyo and Weglot offers an elegant solution for sending targeted emails based on your visitors' language preferences.

In this article, we explore two effective methods for transmitting language data from your website to your Klaviyo account. This integration will allow you to segment your audience by language and send communications perfectly tailored to each linguistic group.


Why integrate Klaviyo and Weglot?

Before delving into the technical aspects, let's take a moment to understand the benefits of this integration.

A multilingual website is a crucial first step to conquering international markets. However, if your post-visit communications (emails, SMS) are not also linguistically adapted, you risk quickly losing the interest of your international prospects.

The Klaviyo-Weglot integration solves this problem by:

  • Automatically capturing the language used by the visitor during their registration
  • Transferring this information as an attribute in their Klaviyo profile
  • Allowing the creation of segments based on language preferences
  • Facilitating the sending of targeted communications in the appropriate language

This personalized approach significantly improves the engagement of your international audience and increases the effectiveness of your marketing campaigns.

Weglot's website.

Method 1: Language capture via Klaviyo signup forms

The first approach involves capturing the language used when a visitor signs up via a Klaviyo form on your website. This method is particularly suitable if you primarily use signup forms to collect contacts.

Step 1: Identify the Klaviyo form on your site

Start by locating the ID of the Klaviyo form concerned. To do this:

  1. Go to your website and open the developer tools (F12 or right-click > Inspect)
  2. Locate the Klaviyo form and identify its data-testid attribute
  3. Note this ID (generally in the format klaviyo-form-XXXXXX)

Step 2: Integrate the necessary scripts

For the integration to work correctly, you must ensure that the scripts are loaded in the correct order:

  1. First, integrate the Weglot script into your HTML code:

<script type=”text/javascript” src=”https://cdn.weglot.com/weglot.min.js”></script>

<script>

    Weglot.initialize({

        api_key: ‘YOUR_API_KEY’

    });

</script>

  1. Next, make sure the Klaviyo script is correctly loaded on your site 
  2. Finally, add the following integration script (adapt the form ID as needed): 

<script>

  function captureLanguageForKlaviyo(lang) {

    setTimeout(function(){

      const klaviyoForm = document.querySelector(‘form[data-testid=”klaviyo-form-URs6Bv”]’);

      const currentLanguage = document.querySelector(‘html’).getAttribute(‘lang’);

      

      if(klaviyoForm && typeof klaviyo !== “undefined”){

        console.log(“Active language capture:”, currentLanguage);

        klaviyo.push([‘identify’, { ‘lang’: currentLanguage }]);

      }

    }, 7000);

  }

  

  captureLanguageForKlaviyo(Weglot.getCurrentLang());

  Weglot.on(‘languageChanged’, captureLanguageForKlaviyo);

  Weglot.on(“switchersReady”, captureLanguageForKlaviyo);

</script>

Step 3: Managing multiple Klaviyo forms

If your site has multiple Klaviyo signup forms, you can adapt the script to take all these forms into account:

<script>

  function captureLanguageForKlaviyo(lang) {

    setTimeout(function() {

      // Add all your form IDs separated by commas

      const klaviyoForms = document.querySelectorAll(‘form[data-testid=”klaviyo-form-ABC123″], form[data-testid=”klaviyo-form-DEF456″], form[data-testid=”klaviyo-form-GHI789″]’);

      const currentLanguage = document.querySelector(‘html’).getAttribute(‘lang’);

      

      if (klaviyoForms.length > 0 && typeof klaviyo !== “undefined”) {

        klaviyoForms.forEach(form => {

          console.log(“Active language capture for form:”, currentLanguage);

          klaviyo.push([‘identify’, { ‘lang’: currentLanguage }]);

        });

      }

    }, 7000);

  }

  captureLanguageForKlaviyo(Weglot.getCurrentLang());

  Weglot.on(‘languageChanged’, captureLanguageForKlaviyo);

  Weglot.on(“switchersReady”, captureLanguageForKlaviyo);

</script>

This approach allows you to capture the language for all users who sign up via any of your Klaviyo forms.

 

Method 2: Integration via the Klaviyo tracking script

The second method uses the Klaviyo web tracking script to capture language preference. This approach is more global and works even for visitors already identified in Klaviyo.

Step 1: Verify the presence of the Klaviyo tracking script

First, make sure the Klaviyo web tracking script is correctly installed on your site. This script generally looks like this:

<script async type=”text/javascript” src=”https://static.klaviyo.com/onsite/js/klaviyo.js?company_id=YOUR_ID”></script>

Step 2: Add the language integration script

After the Weglot and Klaviyo tracking scripts, add the following integration code:

<script>

(function() {

  var updateLanguageInKlaviyo = function(lang) {

    var _learnq = window._learnq || [];

    _learnq.push([‘identify’, {

      $lang: lang

    }]);

    console.log(“Language identified for Klaviyo:”, lang);

  }

  

  // Initial language capture

  updateLanguageInKlaviyo(Weglot.getCurrentLang());

  

  // Update when language changes

  Weglot.on(‘languageChanged’, updateLanguageInKlaviyo);

})();

</script>

This script captures the visitor's current language and transmits it to Klaviyo as a custom attribute. In addition, it triggers with each language change, thus ensuring that the information always remains up-to-date.

 

Configuring language segments in Klaviyo

Once the technical integration is in place, you need to configure Klaviyo to leverage this new language data:

Step 1: Verify the reception of language data

  1. Log in to your Klaviyo account
  2. Go to the "Profiles" section
  3. Search for a profile that signed up after the integration was implemented
  4. Check for the presence of the "lang" or "$lang" attribute in the profile properties

Step 2: Create language segments

  1. In Klaviyo, navigate to "Lists & Segments"
  2. Click on "Create Segment"
  3. Define criteria based on the language attribute:
    • If you used method 1: Properties > lang > equals > "en" (for English)
    • If you used method 2: Properties > $lang > equals > "en" (for English)
  4. Repeat the operation for each language supported by your site

Step 3: Adapt your campaigns and flows

You can now:

  1. Create specific campaigns for each language segment
  2. Use conditions in your flows to send messages in the appropriate language
  3. Personalize content according to language preferences

Best practices and important considerations

To maximize the effectiveness of this integration, keep these recommendations in mind:

Initial capture delay

The script uses a timeout (setTimeout) of 7 seconds to ensure that Klaviyo is properly loaded before attempting language capture. This delay can be adjusted according to your site's performance, but make sure to allow enough time for all necessary scripts to load.

Application to existing visitors

It is important to note that these methods cannot retroactively affect existing profiles in Klaviyo. The language attribute will only be added to new registrants or during updates of existing profiles.

Test before deployment

Before deploying this integration in production:

  1. Test it in a development environment
  2. Verify that the language attribute is correctly transmitted to Klaviyo
  3. Confirm that your language segments are populated with the correct profiles

Maintenance and updates

Application Programming Interfaces (APIs) and HTML structures may change. Plan periodic checks of this integration to ensure it continues to function correctly.

 

Advanced multilingual communication personalization

Once the integration is in place, you can go further in linguistic personalization:

Using conditional templates

In your Klaviyo emails, use conditional logic to adapt content according to language:

{% if person.lang == ‘fr’ %}

  Bonjour {{ person.first_name }},

{% elsif person.lang == ‘es’ %}

  Hola {{ person.first_name }},

{% else %}

  Hello {{ person.first_name }},

{% endif %}

Creating multilingual content matrices

For complex campaigns, consider creating content matrices organized by language. This approach facilitates the management and updating of translations.

Cultural adaptation, not just linguistic

Remember that true personalization goes beyond simple translation. Also adapt:

  • Cultural references
  • Date and time formats
  • Units of measurement
  • Currencies
  • Offers and promotions according to regional specificities

Conclusion: Truly global marketing

The integration of Klaviyo and Weglot represents much more than a simple technical connection. It embodies a respectful marketing approach that is attentive to the linguistic preferences of your international audience.

By intelligently capturing and leveraging your visitors' language preferences, you:

  • Significantly improve the user experience
  • Increase the open and click-through rates of your communications
  • Strengthen the positive perception of your brand
  • Optimize your conversions in international markets

In this age of digital globalization, this integration constitutes a substantial competitive advantage for any company seeking to prosper beyond its original linguistic borders.

Previous
Integrate AfterShip with Klaviyo
Next
Integrate Loop with Klaviyo

DON'T HAVE A KLAVIYO ACCOUNT?

Create yours in minutes!

CREATE A KLAVIYO ACCOUNT