Skip to main content
Users
CloudPortalLogin
  • Powered byPowered by
Introduction to Sitecore Personalize
Managing accounts and system settings
Identifying guests
Introduction to experiments
Introduction to experiences
Decisioning
View dashboards
Developer Center
Connecting to an external system
Using client-side JavaScript
Using server-side JavaScript
AI in Personalize
Glossary
  • Sitecore Personalize
  • Introduction to experiments in Sitecore Personalize
  • Introduction to web experiments in Sitecore Personalize
  • Create a web experiment
  • Use JavaScript in a web experiment

Use JavaScript in a web experiment

To make a web experiment to go-live on your organization's site, you must specify in the JavaScript editor where in the Document Object Model (DOM) you want the offer or content to display. This is how you determine where the HTML will be inserted and rendered on your organization's website.

The JavaScript editor lets you run client-side JavaScript in your variant.

Most variants also must pass server-side guest data to your organization's website, for example, the guest's first name, location, loyalty number, and so on. To facilitate this, you must configure the API response to include the dynamic data so that when the variant executes, the data is requested from the server and then passed to the variant.

You can use JavaScript to access nested values by index from the API response. For example, you might want to display Offers in an experiment that are returned from a Decision Model. Because the offer is a value that is nested in an array, you must use the array.index or array.{index} syntax.

Note

The experiment can call server-side data such as guest attributes, and use it in the CSJS. This can include a full history of the guest as well as a continuous stream of real-time session data.

To use JavaScript in a web experiment:

  1. In the Experiment variants tile, click the Edit icon next to the variant you want to configure.

  2. In the code editor, on the JavaScript tab, enter any JavaScript that you want to use in the web experiment. To automatically format and indent the JavaScript code, click Format JS icon.

  3. To insert dynamic data into JavaScript, on the Data tab, in the Data Selector search box, enter a guest's email address or other identifier to search. This enables you to access data model attributes and paths.

    Tip

    If there is a guest whose data you often use when configuring or testing code, click Bookmark icon to bookmark the guest so you no longer have to search for them.

    Editing the JavaScript to apply personalization in a variant.
  4. To include dynamic guest data, under the Guest data model tree, click Copy icon and click Copy Path as JavaScript.

    You can use any part of the guest data model in your JavaScript, including data extensions and segment memberships, as shown below:

    Using segment memberships from the guest data model in the JavaScript.

    In this example, the code uses guest.segmentMemberships.name to determine if the guest belongs to either the rewards_member segment or the vip_tier segment.

  5. To include dynamic data from the decision model response, expand the Decision Model Response tree, click Copy icon and click Copy Path as JavaScript.

  6. To include dynamic data from the experiment response, expand the Experience Response tree, click Copy icon and click Copy Path as JavaScript.

  7. On the JavaScript tab, paste the data and click Save.

  8. Click to close the code editor.

    You must also include the dynamic data when you compose the API request. This ensures that when the experiment executes, the server requests the dynamic data and passes it to the variant.

Do you have some feedback for us?

If you have suggestions for improving this article,

Privacy policySitecore Trust CenterCopyright © 1999-2025 Sitecore