Attentive Integration with Consentmo

Integrate Attentive with Consentmo to control when the Attentive tracking script loads and how its analytics functionality responds to visitor consent.

The integration uses Consentmo's consent events alongside Attentive's analytics.enable() and analytics.disable() methods to manage tracking when Marketing consent is accepted, rejected, or withdrawn.

How the Integration Works

The integration handles the following scenarios:

• Marketing consent accepted: Loads the Attentive script and enables analytics once available.
• Marketing consent rejected: Prevents the Attentive script from loading.
• Marketing consent withdrawn: Disables Attentive analytics on the current page if the script has already loaded.
• Returning visitors: Checks previously saved consent and applies the appropriate tracking state.
• No banner required: Loads Attentive when Consentmo explicitly reports that the banner is inactive for the visitor.

Important: The Attentive script must not be loaded separately by another app embed, Google Tag Manager, or theme script, as this could bypass the integration.

Integration Steps

Step 1: Open Your Shopify Theme Code

1. Go to Shopify Admin > Online Store > Themes.
2. Click the three-dot menu next to your active theme.
3. Select Edit code.
4. Open the theme.liquid file under Layout.
5. Locate the opening <head> tag.

Step 2: Add the Consentmo Integration Script

Paste the following code inside the <head> section of theme.liquid.

<!-- Start Attentive integration script from Consentmo GDPR Compliance App -->
<script id="consentmo-attentive-integration-script">
(function () {
  "use strict";

  // Replace with your store-specific Attentive script URL.
  var ATTENTIVE_URL =
    "https://cdn.attn.tv/StoreName/dtag.js?shop=StoreName.myshopify.com";

  var attentiveLoading = false;
  var attentiveLoaded = false;
  var marketingAllowed = false;
  var consentResolved = false;
  var retryTimer = null;
  var retryCount = 0;
  var MAX_RETRIES = 80;

  function getAttentiveAnalytics() {
    if (
      window.attentive &&
      window.attentive.analytics
    ) {
      return window.attentive.analytics;
    }

    return null;
  }

  function stopRetry() {
    if (retryTimer !== null) {
      clearTimeout(retryTimer);
      retryTimer = null;
    }
  }

  function updateAttentiveAnalytics() {
    stopRetry();

    if (!consentResolved) {
      return;
    }

    var attentiveAnalytics = getAttentiveAnalytics();

    if (attentiveAnalytics) {
      if (
        marketingAllowed &&
        typeof attentiveAnalytics.enable === "function"
      ) {
        attentiveAnalytics.enable();
        return;
      }

      if (
        !marketingAllowed &&
        typeof attentiveAnalytics.disable === "function"
      ) {
        attentiveAnalytics.disable();
        return;
      }
    }

    if (!attentiveLoading && !attentiveLoaded) {
      return;
    }

    if (retryCount >= MAX_RETRIES) {
      return;
    }

    retryCount++;

    retryTimer = setTimeout(function () {
      updateAttentiveAnalytics();
    }, 250);
  }

  function loadAttentiveScript() {
    if (!marketingAllowed || !consentResolved) {
      return;
    }

    if (attentiveLoading || attentiveLoaded) {
      updateAttentiveAnalytics();
      return;
    }

    var existingScript = document.querySelector(
      'script[src="' + ATTENTIVE_URL + '"]'
    );

    if (existingScript) {
      attentiveLoaded = true;
      updateAttentiveAnalytics();
      return;
    }

    attentiveLoading = true;

    var script = document.createElement("script");
    script.src = ATTENTIVE_URL;
    script.async = true;
    script.type = "text/javascript";

    script.onload = function () {
      attentiveLoaded = true;
      attentiveLoading = false;
      retryCount = 0;
      updateAttentiveAnalytics();
    };

    script.onerror = function () {
      attentiveLoading = false;
    };

    document.head.appendChild(script);
  }

  function enableAttentive() {
    marketingAllowed = true;
    consentResolved = true;
    retryCount = 0;

    loadAttentiveScript();
    updateAttentiveAnalytics();
  }

  function disableAttentive() {
    marketingAllowed = false;
    consentResolved = true;
    retryCount = 0;

    stopRetry();

    var attentiveAnalytics = getAttentiveAnalytics();

    if (
      attentiveAnalytics &&
      typeof attentiveAnalytics.disable === "function"
    ) {
      attentiveAnalytics.disable();
    } else if (attentiveLoading || attentiveLoaded) {
      updateAttentiveAnalytics();
    }
  }

  function handleConsentPreferences(preferences) {
    if (!preferences) {
      return;
    }

    if (preferences.marketing === true) {
      enableAttentive();
    } else {
      disableAttentive();
    }
  }

  // Apply initial consent, including returning visitors.
  document.addEventListener(
    "consentmoSignal_onLoad",
    function (eventData) {
      var signal = eventData.detail;

      if (
        !signal ||
        typeof signal.isActive !== "boolean"
      ) {
        return;
      }

      if (signal.isActive === false) {
        enableAttentive();
        return;
      }

      if (
        signal.consent &&
        signal.consent.preferences
      ) {
        handleConsentPreferences(
          signal.consent.preferences
        );
      } else {
        disableAttentive();
      }
    }
  );

  // Handle consent changes without refreshing.
  document.addEventListener(
    "consentmoSignal",
    function (eventData) {
      var signal = eventData.detail;

      if (
        signal &&
        signal.preferences
      ) {
        handleConsentPreferences(
          signal.preferences
        );
      }
    }
  );
})();
</script>
<!-- End Attentive integration script from Consentmo GDPR Compliance App -->

Step 3: Update the Attentive Script URL

Find the following line:

var ATTENTIVE_URL =
  "https://cdn.attn.tv/StoreName/dtag.js?shop=StoreName.myshopify.com";

Replace the example URL with the exact Attentive script URL provided for your store.

For example, if your Attentive implementation uses a custom loader URL, use that URL instead of the generic example.

Step 4: Prevent Duplicate Attentive Loading

The Consentmo integration must control when Attentive loads.

If Attentive is already loading automatically:

1. Go to Shopify Admin > Online Store > Themes.
2. Click Customize.
3. Open App embeds.
4. Locate the Attentive app embed, if present.
5. Disable its automatic loading and save.

Also check whether the Attentive script is being loaded separately through:

• Google Tag Manager
• Another Shopify Custom Pixel
• An existing script in theme.liquid
• Another third-party integration

Remove or disable duplicate loaders before testing the integration.

Step 5: Save Your Changes

Click Save in the Shopify theme code editor.

The Attentive script will now load according to the visitor's Marketing consent state.

How Consentmo Controls Attentive

The integration listens for two Consentmo events.

consentmoSignal_onLoad

This event provides the initial consent state when Consentmo initializes.

It is used to:

• Check existing consent for returning visitors.
• Load Attentive when Marketing consent has already been granted.
• Keep Attentive blocked when Marketing consent is not granted.
• Handle regions where Consentmo explicitly reports that the banner is inactive.

consentmoSignal

This event handles consent changes made on the current page.

When Marketing consent is accepted, the integration loads Attentive and calls:

window.attentive.analytics.enable();

When Marketing consent is withdrawn, the integration calls:

window.attentive.analytics.disable();

These methods are executed only when the Attentive Analytics API is available.

Note: Disabling Attentive analytics does not automatically unload the Attentive script or delete cookies previously created by the service.

Testing the Integration

After installing the script, test the following scenarios.

1. Before Consent

1. Open the storefront in an incognito window.
2. Open Developer Tools > Network.
3. Search for attn.
4. Do not interact with the cookie banner.

Expected result: The Attentive tracking script should not load before Marketing consent.

2. After Accepting Marketing Consent

1. Accept Marketing cookies using the Consentmo banner.
2. Keep Developer Tools open.
3. Check whether the Attentive script loads.
4. Navigate to a product page.

Expected result: Attentive loads and its analytics functionality is enabled. Product-view events should be tested to confirm they work without requiring a refresh.

3. After Rejecting Marketing Consent

1. Open the Consentmo preferences.
2. Disable Marketing consent.
3. Save your preferences.

Expected result: If Attentive has already loaded, the integration calls window.attentive.analytics.disable().

If Attentive has not loaded yet, it remains blocked.

4. Returning Visitors

1. Accept Marketing consent.
2. Refresh the storefront.

Expected result: Attentive loads based on the previously saved Marketing consent without requiring another banner interaction.

Repeat the test with Marketing consent rejected.

Expected result: Attentive remains blocked.

5. Verify the Attentive Analytics API

Once Attentive has loaded, open the browser console and execute:

typeof window.attentive?.analytics?.enable
typeof window.attentive?.analytics?.disable

Both should return:

"function"

If either method is unavailable, confirm the Attentive script has initialized and that the installed version supports these methods.

Important Considerations

• The integration blocks the Attentive script until Marketing consent is granted.
• Consent changes are handled on the current page without automatically requiring a page refresh.
• The Attentive Analytics API must support enabling and disabling tracking after initialization.
• If product-view events do not resume immediately after consent, Attentive support may need to confirm whether additional initialization or event replay is required.
• Consent withdrawal disables Attentive analytics when the API is available, but does not automatically remove previously created cookies.
• If Consentmo explicitly reports an inactive banner, the integration allows Attentive to load. Merchants should ensure that this behavior matches their regional privacy requirements.

Need Help?

If you encounter issues with the integration or need assistance testing Attentive alongside Consentmo, contact our support team through the app's live chat or at support@consentmo.com.

Updated on: 19/10/2026