APPLICABILITY: Testing, Insights, Personalize, and Web Rollouts in Enterprise accounts

Overview

VWO's Sitewide JS feature offers a powerful way to inject custom code that executes before any VWO campaigns run on your website. Imagine these scenarios:

• Custom Events Triggering and Visitor Attribute Sync: Use the Sitewide JS to add custom events or synchronize visitor attributes that are common across your VWO campaigns. This saves from repetitive application of the same events and attributes. 
  
  
• Advanced User Segmentation: Access and process website data (cookies, local storage) to define custom user attributes for VWO. This allows you to segment visitors based on specific criteria beyond what VWO natively supports.
  
  
• Third-Party Integration: You can use the Sitewide JS to apply custom integration code that works across multiple VWO campaigns. This approach ensures consistency and efficiency in your integrations, reducing the need for repetitive coding.

With the Sitewide JS implementation, you can apply code across your website before the execution of your VWO campaigns. This ensures that a layer of change is applied, on top of which your campaigns can be executed.

You can also apply it to all your subdomains in a single click.

ATTENTION: To minimize the impact on loading time, sitewide code is limited to 2 KB, ensuring it remains lightweight and doesn't affect performance.

How to Access it?

If you have registered your website on VWO, on the main menu of your VWO dashboard: 

1. Go to Configurations > Websites and Apps > select your website. 
2. Go to the Sitewide JS tab, where you can implement your sitewide JS code.

Implementing a Sitewide JS Code

Imagine you want to display your website content in different languages based on visitor preferences stored in local storage. You can use this information to A/B test dynamic content on your website.

Challenge:

You want to test the effectiveness of different dynamic content elements (e.g., headlines, articles, banner messages) on your webpage based on visitor language. However, the website utilizes local storage to hold language preferences, which are stored in JSON format and cannot be directly used for segmentation within VWO campaigns.

Solution:

Sitewide JS Implementation: 

1. Write a JavaScript (JS) code snippet to extract the language code from local storage and set it in a global JS variable.

   // Example code to set the language preference in a global variable
   var languagePreference = JSON.parse(localStorage.getItem('languagePreference'));
   window.vwoLanguage = languagePreference.code; 
   // Assuming the language code is stored under the 'code' key

2. Ensure this JS code runs on all pages of your website where you want to apply the segmentation.

ATTENTION: Irrespective of the product type, there should be at least one active campaign to run the sitewide JS.

Target VWO Campaign Variations: 

1. In VWO, go to your campaign settings.
2. Navigate to Custom Segment > JS Variable.
3. Enter the name of the JS variable (e.g., vwoLanguage).
4. Choose the appropriate operator (e.g., equals).
5. Enter the value of the JS variable that corresponds to the language codes used in your sitewide JS (e.g., “en-US”, “fr-FR”).

By setting up this segmentation, you can now apply a language-based layer of change on your website before implementing any campaign changes. This ensures that your tests and optimizations are based on the correct visitor data, providing more accurate and relevant results.

INFO: If you’re encountering issues with the execution of the sitewide JS, you can contact the support team.