How to implement third-party tags in Google Tag Manager

Author:

Implementing third-party tags in Google Tag Manager (GTM) allows you to easily manage and deploy external services like analytics, advertising, or other tracking tools without directly editing the website’s code. This process streamlines the integration of various third-party tools, such as Google Analytics, Facebook Pixel, or other marketing and tracking pixels. Below is a step-by-step guide on how to implement third-party tags in Google Tag Manager.

Step 1: Set Up a Google Tag Manager Account and Container

Before implementing third-party tags, ensure that you have:

  1. A Google Tag Manager account and a container set up for your website or app.
  2. GTM installed on your website or app (if not already done). If you’re unsure, follow the instructions provided by Google to install the GTM snippet.

If you’re already set up, you can proceed to implement the third-party tags.

Step 2: Identify the Third-Party Service

First, determine which third-party service or platform you want to integrate with Google Tag Manager. Examples of third-party services include:

  • Google Analytics for tracking website traffic and behavior.
  • Facebook Pixel for tracking conversions and retargeting ads.
  • Hotjar for heatmaps and user behavior analytics.
  • AdRoll for retargeting ads.
  • LinkedIn Insight Tag for LinkedIn ad tracking.

Each service will provide a tracking code or tag that you need to implement in your website.

Step 3: Add a New Tag in GTM

  1. Log into Google Tag Manager:
    • Go to Google Tag Manager and log in to your account.
    • Select the container associated with the website or app where you want to add the third-party tag.
  2. Create a New Tag:
    • On the left-hand side of the GTM interface, click on Tags.
    • Click on New to create a new tag.
  3. Choose Tag Type:
    • After clicking New, you’ll be prompted to select a Tag Type. GTM has built-in templates for many third-party services. To implement a third-party tag, you can either use a built-in template if available or use a Custom HTML tag if the service does not have a dedicated template.

    Option 1: Using Built-In Tag Templates (If Available)

    • If the third-party service has a built-in tag template, GTM will show it in the list. For example, to add Google Analytics, select Google Analytics: Universal Analytics.
    • Configure the tag by entering the required parameters like Tracking ID (e.g., for Google Analytics) or the Pixel ID (e.g., for Facebook Pixel).
    • Follow the service-specific instructions for any additional settings (e.g., event tracking, conversion goals, etc.).

    Option 2: Using Custom HTML Tag (For Other Third-Party Tags)

    • If no template exists for the third-party service, you’ll need to use the Custom HTML tag.
    • Choose Tag Configuration > Custom HTML and paste the tracking code or script that you received from the third-party platform into the HTML text area.

      For example, to add a Facebook Pixel:

      html
      <script>
      !function(f,b,e,v,n,t,s)
      {if(f.fbq)return;n=f.fbq=function(){n.callMethod?
      n.callMethod.apply(n,arguments):n.queue.push(arguments)};
      if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
      n.queue=[];t=b.createElement(e);t.async=!0;
      t.src=v;s=b.getElementsByTagName(e)[0];
      s.parentNode.insertBefore(t,s)}(window, document,'script',
      'https://connect.facebook.net/en_US/fbevents.js');
      fbq('init', 'YOUR_PIXEL_ID'); // Replace 'YOUR_PIXEL_ID' with your actual Facebook Pixel ID
      fbq('track', 'PageView');
      </script>

Step 4: Set Triggers for the Tag

To determine when the tag should fire on your website, you need to create a Trigger. For example:

  • For a Google Analytics tag, you may want it to fire on every page view.
  • For a Facebook Pixel, you might want the tag to fire only on specific pages or events (like a purchase or registration).

Add a Trigger:

  1. Click on Triggering in the tag setup panel.
  2. Choose an appropriate trigger for the tag. You can select from common triggers like:
    • Page View (fires when any page loads).
    • Click Trigger (fires when a specific button or element is clicked).
    • Form Submission (fires when a form is submitted).
    • Custom Event (fires when a specific custom event occurs, like a transaction).

    For example, for Google Analytics or Facebook Pixel, select All Pages if you want the tag to fire on every page load.

Configure Custom Triggers (Optional):

If you need more specific conditions, you can create custom triggers based on the URL, click classes, or any other variable.

Step 5: Test Your Tag

Before publishing the tag live, it’s essential to test it to make sure it’s firing correctly.

  1. Preview Mode:
    • Click on Preview in the top-right corner of the GTM interface.
    • This will activate GTM’s Preview Mode, allowing you to see which tags are firing as you interact with your website.
  2. Test the Tag:
    • Once Preview Mode is enabled, go to your website.
    • Check the GTM debugging panel to verify if the third-party tag is firing as expected when you navigate the website or trigger the specified events.
  3. Use Chrome Developer Tools:
    • You can also check whether the third-party tag is loading properly by inspecting the Network tab in Chrome Developer Tools. Look for the request sent to the third-party service (like a Google Analytics or Facebook Pixel request).

Step 6: Publish the Container

After successfully testing your tags, you’re ready to publish the changes.

  1. Submit Changes:
    • Go back to Google Tag Manager, click on Submit in the upper-right corner.
  2. Version Description:
    • Provide a version name and description (optional), then click Publish to make the tags live.

Step 7: Monitor and Troubleshoot

Once your third-party tags are live, monitor them to ensure they are working as expected:

  • Google Analytics: Check the Real-Time reports to verify that data is being sent.
  • Facebook Pixel: Use Facebook’s Pixel Helper Chrome extension to verify that the pixel is firing correctly.

If any issues arise, you can return to GTM, make adjustments, and republish the container.

Conclusion

Implementing third-party tags in Google Tag Manager simplifies the process of adding and managing tracking codes on your website. By leveraging GTM’s built-in templates or using custom HTML tags, you can integrate various external services like Google Analytics, Facebook Pixel, and other marketing or analytics tools without directly modifying the website’s code. Always ensure you test your tags thoroughly before publishing them and monitor their performance after deployment.

Categories: Digital Marketing