Usetiful offers a simple way to run multi-lingual product tours:


  1. Create your product tour in your master language (for example, English)
  2. Clone your tour and translate it into one of your secondary languages (for example, German)

    Now, you have created two tours in English and German respectively. Next steps will ensure that the tour in English will show up on pages that are in English, and the tour in German will show up in the pages that are correspondingly in German.

  3. Depending on how your product/page is built, you can target one of the following ways:
    1. Leveraging user segmentation - this is the most reliable way. If your installed Usetiful script shares the language as a tag, you can target tours using this condition.

      Here's an example of the setting. Note that this requires additional setup on how pages are loaded. Find out more



    2. NEW using browser language - the setting "Language is" will check for the preferred language in the visitor's browser settings, and based on that will display respective tour.

      Here's an example of the settings for preferred languages in Chrome
      Notice that English comes first - this means that your browser is communicating to Usetiful that you prefer to see content in English.


      And here is the corresponding setup that will display the tour on pages that have this same code, and therefore are in English


    3. Using the URL - if your pages contain language in their URL (for example, www.exampledomain.com/de-de/pagename), you can simply target your tours with condition URL contains (value would be "de-de").

      Here's the corresponding setup example


    4. Using language selector - if your page provides users with language selector (example below), target the user's choice using condition Element value contains (element would be the language selector and value would be, for example, "English")

      Here's an example language selector on the page
      Here's the corresponding code chunk
      <div class="abc-selected-option-text">English</div>

      And here's the corresponding setup in the tour targeting options.

      When users of the page change the language, the text English in the code chunk will be replaced with another language, and therefore Usetiful will display the tour which has corresponding setup - Element text contains - selector is the same - and corresponding language name.

More info on page targeting can be found here.