Last updated Oct 31, 2023

Google Tag Manager

Initial Setup

Understanding the data layer

The data layer should have been implemented on your web page by your developers.

A data layer is an object that contains all of the information that you want to share with Google Tag Manager (GTM). Information such as events or variables can be shared to Google Tag Manager via the data layer, and triggers can be set up in Google Tag Manager based on the values of variables (e.g., fire a remarketing tag when purchase_total > $100) or based on the specific events. Variable values can also be shared through to other tags (e.g., add purchase_total into the value field of a tag).

Refer to the GTM developer guide for comprehensive details on how the data layer works.

Example of a data layer:

window.dataLayer = window.dataLayer || []

window.dataLayer.push({
    'email':'jenny.smith@rokt.com',
    'consumer': {
        'firstname' : 'Jenny',
        'lastname' : 'Smith'
    },
    'ecommerce': {
        'transaction': {
            'amount' : '12.36'
        }
    },
    'event':'gtm.transactionComplete'
});

Add Rokt integration

Integrating via the Rokt Tag TemplateIntegrate via a Custom HTML Tag

Add a trigger

Click Triggering.

Single Page ApplicationMulti-page Application

Test the integration

Testing with the Rokt Tag TemplateTesting with a Custom HTML Tag

Integrate the Rokt ID with Google Tag Manager

note

The following are instructions to integrate Rokt ID on your landing page with Google Tag Manager. More information on Rokt ID.

If you'd like to integrate the Rokt ID on your landing page directly, please see this integration guide.

1. Open Google Tag Manager.

2. Click Tags.

3. Click New.

4. Name your tag.

5. Click Tag Configuration.

6. Select Custom HTML.

7. Add one of the following code snippets into the HTML field depending on whether your website is using one or multiple subdomains.

   For single subdomain:

   <script src="https://apps.rokt.com/integrations/referral-tag/referral-tag.js" async></script>
   For multiple subdomains:

   <script>
    var scriptElement = document.createElement('script');
    scriptElement.src = 'https://apps.rokt.com/integrations/referral-tag/referral-tag.js';
    scriptElement.async = true;
    scriptElement.setAttribute('data-fp-domain', 'your_base_domain');
    document.head.appendChild(scriptElement);
   </script>

   

8. Setup a trigger to fire the Rokt ID tag on the correct page. This will most likely be your landing page.

   1. Click the Plus icon in the top right to create a new trigger and then name it. If your webapp is a Single Page Application, choose the trigger type History Change, otherwise pick Page View.
   2. Change the trigger firing rules to Some History Changes or Some Page Views.
   3. Enter the URL parameter that identifies the page where the tag should fire. For example, if your confirmation page is example.com/cart/payment/shipping the identifying parameter can be any of cart, payment, or shipping. .
   4. Click Save.

9. Click Save.

   

Testing and validation

1. From Google Tag Manager go to your workspace and choose Preview.

   1. Enter the URL of your site.
   2. Choose Connect. This should open a new window running the newly set up Rokt ID tag.

2. Copy the URL of the newly opened window and forward this to your Rokt account manager. They perform the testing and QA for the Rokt ID tag integration.

Identify your variable name

Variables are set up in your GTM and are matched to the data layer. Refer to the GTM developer guide for more details about variables.

The structure of your data layer on your page affects the data layer variable name in your GTM.

Example data layer script 1:

window.dataLayer.push({
    'email':'jenny.smith@rokt.com'
});

Data layer variable name: email

Example data layer script 2:

window.dataLayer.push({
    'consumer': {
        'firstname' : 'Jenny'
    }
});

Data layer variable name: consumer.firstname

Example data layer script 3:

window.dataLayer.push({
    'ecommerce': {
        'transaction': {
            'amount' : '12.36'
        }
    }
});

Data layer variable name: ecommerce.transaction.amount

Set up variables in GTM

1. Open Google Tag Manager.

2. Click Variables,

3. Under User-defined variables, click New.

   

4. Name your variable.

   In the example below, the name is dl_email

5. Set Variable Type as Data Layer Variable.

6. Enter the Data Layer Variable Name. See the examples above to identify the variable name based on your data layer structure.

7. Click Save.

GDPR and CCPA Compliance

Under the GDPR or ePrivacy, any website that uses cookies or tracking technology must obtain user consent. Advertisers should ensure consent is obtained when using the Rokt ID solution, and should block the Rokt script from running where users have opted out of cookies or tracking technology in order to meet their compliance obligations.

Under the CCPA, covered businesses must disclose to users details of the use of such technology.

Cookie consent can be implemented with any Consent Management Platform or Tag Manager, including Google Tag Manager. If other conversion attribution tags are conditionally allowed based on cookie consent, please implement the Rokt ID tag in a similar fashion. If the Rokt ID tag is the first which needs to be conditionally turned off and you are unsure of how to implement it, please reach out to your Rokt account manager.

For more information on the Rokt ID solution described in this section, please refer to our Cookie Policy.