Overview: Manage 3rd-party tags (web)

Managing vendor tags properly is core to your CMP implementation. Even if you leverage frameworks such as the IAB’s Transparency and Consent Framework (TCF) or the Global Privacy Protocol (GPP) you may have tags from third-party vendors that do not participate in those frameworks and therefore need to be managed outside of the framework.

The Sourcepoint CMP provides an array for products, features, and APIs to prevent third-party tags and code snippets from firing, setting cookies, or setting localStorage until the end-user's consent status is known and explicitly permits it. This document guides you through some of the most common ways to work with the various tools Sourcepoint provides.


Getting started

Deciding which method to employ in managing your 3rd-party tags depends on a variety of factors. Please review the questions below to help your organization choose which route is best for you:

  • Do you have access to development resources to help implement more technical methods proposed in this article?
  • Are you creating a consent solution for a GDPR campaign? U.S. Multi-State Privacy campaign? Or both?
  • Which 3rd-party tags need to be controlled by end-user consent?
  • Does your website leverage Google Consent Mode?
  • Does your organization utilize a tag management system like Google Tag Manager, Adobe Launch, Telium, or other?
  • If your organization has multiple properties, do you need to manage them differently?

Tag manager integration (No development)

For websites already leveraging a tag management solution, integrating Sourcepoint with your tag manager is an effective way to manage 3rd-party tags without relying on development resources. The Sourcepoint consent toolkit contains a feature called Consent Actions/Opt-in Hooks for each supported regulation. These events fire based on whether a third-party vendor has consent, which is defined in the Sourcepoint portal.

 Resources

Additional information on configuring Consent Actions/Opt-in Hooks can be found below:

Regardless of which tag manager your organization utilizes, the steps to integrate are similar:

  1. Configure the your 3rd-party tag in your tag manager
  2. Set the tag to fire on a custom trigger
  3. Configure a Sourcepoint Consent Action/Opt-in Hook to fire only when the end-user has provided consent (custom JavaScript)

  Note: Sourcepoint provides a direct integration with Google Tag Manager which does not require the use of custom Javascript. Click here for more information.

Review our integration documentation for more details on a specific tag manager.


Manage 3rd-party vendor tags with JavaScript APIs

Your organization can manage the firing of 3rd-party vendor tags using Sourcepoint's JavaScript APIs. This method managing 3rd-party vendor tags require development resources to do the following:

  • Define function to read consent data and execute vendor tags
  • Leverage onConsentReady event callback 
GDPR TCF GDPR Standard U.S. Multi-State Privacy (GPP/Standard) Global Enterprise

Define function to read consent data and execute vendor tags

Create a function that defines the vendor tags that should be executed when consent for the vendor is present in the consentData. In the example below, we have defined the vendors, their ids, and function to execute their tags in the vendorsArray. We then loop through the vendorsArray and check whether the consentData for that particular vendor id has vendor grants set to true.  

function executeVendorFunctionsGDPR(consentData) {
  const vendorsArray = [
    {
      id: '5fac56cd1ba05165880458ad', // Facebook Pixel
      name: 'Facebook Pixel',
      fn: () = {
        console.log('Facebook Pixel would fire here.');
      }
    },
    {
      id: '5e542b3a4cd8884eb41b5a72', // Google Analytics
      name: 'Google Analytics',
      fn: () = {
        console.log('Google Analytics would fire here.');
      }
    }
  ];

  vendorsArray.forEach(({ id, name, fn }) = {
    const grant = consentData.grants?.[id];
    if (grant && grant.vendorGrant === true) {
      try {
        fn();
      } catch (err) {
        console.error(`Error executing ${name} function:`, err);
      }
    } else {
      console.log(`${name} blocked due to missing or false vendorGrant.`);
    }
  });
}
    

Leverage onConsentReady event callback

From the onConsentReady event callback in the client configuration, utilize Sourcepoint's getCustomVendorConsents command to retrieve the end-user's consent data and pass that information to your previously configured executeVendorFunctionsGDPR function.

onConsentReady: function (message_type, consentUUID, euconsent, info) {
  if(message_type == "gdpr" && info.applies){
    __tcfapi('getCustomVendorConsents', 2, (consentData, success) = {
        if (!success || !consentData) {
          console.warn('Failed to get vendor consents.');
          return;
        }

        // ✅ Call your existing logic
        executeVendorFunctionsGDPR(consentData);
    });
  }
},

Automatically block script-tags based on vendor consent

While Sourcepoint does not provide a native way to block 3rd-party vendor scripts on your web properties, your organization can leverage Sourcepoint's APIs to check for vendor consent and implement functionality to load a 3rd-party vendor script. 

Format 3rd-party script tags

The methodology used in this section relies on setting/removing the src attribute in your 3rd-party vendor script tags based on the end-user's vendor consent. The URL to your 3rd-party vendor script is initially stored in a sp-src attribute. Format your 3rd-party script on your web property as such:

<script>
  id="Facebook_Pixel"
  type="text/javascript" 
  sp-src="https://FBAtag.js" 
  vendor-id="5fac56cd1ba05165880458ad"
</script> 

Consent validation and conditional script loading

Please select a tab below to review the JavaScript snippet for different Sourcepoint messaging campaigns.

  Note: Ensure that the 3rd-party vendor's URL is correctly configured for the vendor tag's sp-src attribute and that the ID used in the vendor-id attribute matches the vendor ID used by the Sourcepoint system.

GDPR TCF GDPR Standard U.S. Multi-State Privacy (GPP/Standard) Global Enterprise

The following JavaScript snippet listens for the TCF consent event and utilizes Sourcepoint's getCustomVendorConsents command to retrieve the end-user's consent data. The script then validates that the vendorGrant for the specified vendor is set to true. If consent is granted, the script tag’s src attribute is set accordingly and the sp-src attribute is removed to initiate loading.

For your convenience, we've included logging in the example snippet which will print the attributes of the specified script tags after the script executes. 

<script  type="text/javascript">
  __tcfapi('addEventListener', 2, (tcdata, success) = { 
    if (tcdata.eventStatus === "tcloaded" || tcdata.eventStatus === "useractioncomplete") {
      const scriptsToBlock = document.querySelectorAll('[vendor-id]'); // broader selector

      __tcfapi('getCustomVendorConsents', 2, (tcdata, success) = {    
        scriptsToBlock.forEach(element = {
          const vendorId = element.getAttribute("vendor-id");
          const grant = tcdata.grants?.[vendorId]?.vendorGrant;

          if (grant === true) {
            // ✅ Allow vendor script to run
            element.setAttribute("src", element.getAttribute("sp-src"));
            element.removeAttribute("sp-src");
            console.log(`✅ Consent granted for vendor-id: ${vendorId}`);
          } else {
            // 🚫 Consent not granted
            const currentSrc = element.getAttribute("src");

            if (currentSrc) {
              element.setAttribute("sp-src", currentSrc); // Store the src
              element.removeAttribute("src");             // Block the script
              console.log(`🚫 Consent denied for vendor-id: ${vendorId} — src moved to sp-src`);
            } else {
              console.log(`🚫 Consent denied for vendor-id: ${vendorId} — no src to move`);
            }
          }

          // 🧾 Log attributes of the script tag
          logScriptAttributes(element);
        });
      });
    }
  });

  // 📋 Utility to log all attributes of a script tag
  function logScriptAttributes(script) {
    if (!script) {
      console.warn('Script element is null or undefined');
      return;
    }

    console.log(`🔍 Attributes for <script id="${script.id || 'no-id'}">:`);
    Array.from(script.attributes).forEach(attr = {
      console.log(`  ${attr.name} = "${attr.value}"`);
    });
  }
</script>

Fire event-based 3rd-party vendor tag

There can be instances where your 3rd-party vendor tags may not fire on the page load. For example, the 3rd-party vendor tag does tracking only on a button click or other event. In these instances, your organization should develop a function that listens for the event and executes the 3rd-party vendor tag if the vendor has been consented to/ opted into by the end-user.

 Example

The example used in this section sets a Google Analytics tag only when an end-user selects a sign-up button. 

Function to execute 3rd-party vendor tag

In the example function below, we are listening to when a sign up button (with id signupButton) is clicked. When clicked, we pass a variable containing the vendor consent status for Google Analytics (gaConsent) and if that variable is true then we execute the Google Analytics tag.  

<script>
  document.getElementById('signupButton').addEventListener('click', function() {
    console.log('process form data');
    sendFormData();
    if(gaConsent === true){
      console.log('Fire Google Analytics tag');
      gtag('event', 'button_click', {
        'event_category': 'engagement',
        'event_label': 'signup_button',
        'value': 1
      });          
    } else{
      console.log('Google Analytics tag not fired');
    }
  });
</script>  

Retrieve end-user consent for vendor

In order to successfully execute the Google Analytics tag as defined in the function above, we need to pass the gaConsent variable which contains the vendor consent status for Google Analytics. Below are two examples for how to set the vendor consent status for Google Analytics.

Set gaConsent in Sourcepoint portal

Configuring the boolean value for gaConsent in the Sourcepoint portal requires that you define the value in the consent action/opt-in hook and reject action/opt-out hook for the vendor (in our example Google Analytics). 

To start, navigate to the vendor list associated with your property by selecting Vendor Management and then your vendor list regulatory framework.

Screenshot 2025-06-23 at 1.20.20 PM.png

Select the vendor list associated with your property from the subsequent list.

Screenshot 2025-06-23 at 1.22.44 PM.png

Select the tab below for specific details for your vendor list.

GDPR TCF/Stadard U.S. Multi-State Privacy (GPP/Standard) Global Enterprise

From your GDPR TCF or GDPR Standard vendor list, select Google Analytics from your list of vendors.

Screenshot 2025-06-23 at 1.33.33 PM.png

Select Consent Actions tab and click Custom JS. Use the provided space to set gaConsent = true. This will set the value of gaConsent to true when the Google Analytics vendor has end-user consent. 

Screenshot 2025-06-23 at 1.41.41 PM.png

From the same modal, select the Reject Actions tab and click Custom JS. Use the provided space to set gaConsent = false. This will set the value of gaConsent to false when the Google Analytics vendor does not have end-user consent. 

Screenshot 2025-06-23 at 1.45.00 PM.png

Click Apply changes when finished. Click Save in the vendor list builder to confirm the changes.

Set gaConsent using get user consent command

As an alternative to setting gaConsent from within the Sourcepoint portal, your organization can leverage Sourcepoint's get end user consent command in conjunction with the onConsentReady event callback to set the value based on the end-user's current consent status. Select the tab below for specific details.

  Note: In all the examples below, the function loops through the response from a command to retrieve the end-user's consents and assigns the boolean value based on whether the vendor id for the vendor has been consented to/ opted into or not. 

GDPR TCF GDPR Standard U.S. Multi-State Privacy (GPP/Standard) Global Enterprise

The function leverages the getCustomVendorConsents call and loops through the consentedVendors array to find whether Google Analytics' vendor id is present. If it is present then it sets gaConsent = true and if it absent then it sets gaConsent = false.

onConsentReady: function(consentUUID, euconsent) {
  console.log('[event] onConsentReady', arguments);
  __tcfapi('getCustomVendorConsents', 2, function(data, success) {
    const consented = data.consentedVendors || [];
    gaConsent = consented.some(v = v._id === '5e542b3a4cd8884eb41b5a72');
    console.log(gaConsent ? 'gaConsent true' : 'gaConsent false');
  });
},
Was this article helpful?
0 out of 0 found this helpful

Comments

0 comments

Article is closed for comments.