Edit

Integrating the Web SDK

Before you begin

Make sure you retrieve your account ID from the Rokt platform. If you don't yet have a Rokt account, reach out to your account manager.

To find your account ID:

  1. Log in to Rokt.
  2. From the left navigation, click Tag.
  3. You will see a snippet on the right hand side of the page that includes your account ID in the correct place.

You can also contact your account manager if you need assistance.

Each account has a unique account ID. If you are using multiple accounts, including parent or child accounts, make sure you are using the right account IDs for each of your properties.

Understanding the Rokt Web SDK object

The Rokt object provides the entry point to integrate with Rokt solutions. It is available as a global variable under a name specified in your snippet script. Your snippet script should resemble the following:

(function(r,o,k,t,n,e,w,a,_){r._ROKT_=n;r[n]=r[n]||{id:t,h:w,lc:[],it:new Date(),onLoaded:function(c){r[n].lc.push(c)}};a=o.createElement('script');a.type='text/javascript';a.async=!0;a.src=k;if(e){a.integrity=e;a.crossOrigin='anonymous'}_=o.getElementsByTagName('script')[0];_.parentNode.insertBefore(a,_)})(window,document,'https://apps.rokt.com/wsdk/integrations/snippet.js','roktTagid', 'rokt');

Please notice the following important parameters in the arguments list above:

  • https://apps.rokt.com/wsdk/integrations/snippet.js—is the URL pointing to the latest version of the Rokt object.
  • roktTagID—your unique Rokt Tag ID and should be replaced with the correct value.
  • rokt—the name under which this object will be exposed on your window object. In this case it will be accessible using window.rokt or simply rokt.

So as to not interfere with the loading of your page, the Rokt object loads asynchronously. This means that at the time of running the initialization snippet, the full functionality of the Rokt object is not available. Only the Rokt.onLoaded function is immediately available, while the rest of the functionality is added when the Rokt object has been fetched and completely loaded. In order to be informed when you can start integrating fully, you can pass a callback function to Rokt.onLoaded.

rokt.onLoaded(function(rokt) {
  // All functionalities described in this document are already available at this point of time.
  rokt.setAttributes({
    email: '',
  });
});

Learn more about the Rokt object and available methods.

Learn more about setting attributes.

Placing the snippet

To place the snippet:

  1. Replace roktTagid in the Rokt object script with your Account ID. If you need help locating your Account ID, reach out to your account manager.

  2. Add additional functions depending on your integration requirements. You can find links to examples of common integration scenarios at the end of this article.

  3. Add the script to any relevant pages, either where you want a placement to display or a conversion event to trigger.

Follow our integration best practices to optimize page load times and performance outcomes.

Testing your integration

Read our guide on testing your integration.

Example integrations

← ArchitectureConfirmation page integration →