How to implement Twitter Universal Website Tag using Google Tag Manager

Author:

To implement the Twitter Universal Website Tag using Google Tag Manager (GTM), you need to follow a series of steps to ensure that Twitter’s conversion tracking works properly across your website. The Universal Website Tag (UWT) helps track specific events and actions (like page views, conversions, and other user interactions) on your website and send them to Twitter for advertising optimization and measurement.

Here’s a step-by-step guide on how to implement Twitter’s Universal Website Tag with Google Tag Manager:

Step 1: Create a Twitter Ads Account and Get the Universal Website Tag

  1. Log in to your Twitter Ads account:
  2. Access the Pixel Setup:
    • In the Twitter Ads Dashboard, navigate to Tools > Conversion Tracking.
    • Under Conversion Tracking, you’ll find the option to Create a New Tag or select an existing one. Choose Universal Website Tag.
  3. Get the Twitter Tag Script:
    • After creating a new tag, you’ll be provided with a piece of code that looks similar to this:
      javascript
      <script>
      !function(e,t,n,s,u,a){e.twq||(s=e.twq=function(){s.exe?s.exe.apply(s,arguments):s.queue.push(arguments);},s.version='1',s.queue=[],a=t.createElement(n),a.async=!0,a.src=u,a.charset='utf-8',a.type='text/javascript',e.head.appendChild(a))}(window,document,'script','//static.ads-twitter.com/uwt.js');
      twq('init','YOUR_TWITTER_PIXEL_ID');
      twq('track','PageView');
      </script>
    • Replace 'YOUR_TWITTER_PIXEL_ID' with your actual Twitter Pixel ID.

Step 2: Set Up Google Tag Manager (GTM)

If you haven’t already set up GTM on your site, follow these steps:

  1. Sign Up for Google Tag Manager:
    • Visit Google Tag Manager and create an account.
    • Set up a new container and choose the platform (e.g., Web).
  2. Install GTM Snippet:
    • After setting up the container, you’ll receive two snippets of code: one for the <head> and one for the <body>.
    • Add the GTM snippets to your website’s code, ensuring it’s installed on all pages where you want to track user interactions.

Step 3: Create a Tag for Twitter UWT in GTM

Now, you’ll create a tag within GTM to implement the Twitter Universal Website Tag on your website:

  1. Log in to GTM:
  2. Create a New Tag:
    • In GTM, click on Tags in the left-hand menu, then click the New button to create a new tag.
  3. Choose Tag Type:
    • Select Custom HTML Tag. This will allow you to paste the custom Twitter UWT script.
  4. Paste the Twitter UWT Script:
    • In the HTML section, paste the Universal Website Tag script you copied from Twitter (from Step 1).
      javascript
      <script>
      !function(e,t,n,s,u,a){e.twq||(s=e.twq=function(){s.exe?s.exe.apply(s,arguments):s.queue.push(arguments);},s.version='1',s.queue=[],a=t.createElement(n),a.async=!0,a.src=u,a.charset='utf-8',a.type='text/javascript',e.head.appendChild(a))}(window,document,'script','//static.ads-twitter.com/uwt.js');
      twq('init','YOUR_TWITTER_PIXEL_ID');
      twq('track','PageView');
      </script>
    • Important: Replace 'YOUR_TWITTER_PIXEL_ID' with the actual pixel ID you got from Twitter.
  5. Set the Trigger for the Tag:
    • For tracking page views, create a Page View Trigger to fire this tag on all pages.
      • To do this, click on the Triggering section of the tag and choose All Pages as the trigger.
    • If you want to track specific actions (such as purchases, form submissions, or other conversions), you’ll create custom triggers for those events later (covered in Step 4).
  6. Save the Tag:
    • Once you’ve set the script and trigger, click Save.

Step 4: Set Up Additional Event Tracking (Optional)

If you want to track more than just page views, you can implement additional event tracking (such as purchases, form submissions, or button clicks) to capture specific actions on your website.

  1. Track a Custom Event (e.g., Purchase):
    • Create a new Custom HTML Tag for the event (e.g., purchase, sign-ups, or button clicks).
    • For a purchase event, the script would look like this:
      javascript
      <script>
      twq('track', 'Purchase', {
      'value': {{Transaction Value}}, // Transaction amount (replace with your dynamic variable)
      'currency': 'USD' // Set the currency, e.g., USD or EUR
      });
      </script>
    • Replace {{Transaction Value}} with your dynamic variable (you can pull this data from your eCommerce platform or use GTM variables).
  2. Set the Trigger for Custom Event:
    • Create a trigger for the specific action, such as a Click Trigger for a purchase button or a Form Submission Trigger for sign-ups.
    • Select the appropriate trigger based on the event you want to track.
  3. Save the Tag:
    • Once the custom event script and trigger are configured, click Save.

Step 5: Test Your Implementation

After setting up the tag and triggers, use the Preview Mode in Google Tag Manager to test if the tag fires properly:

  1. In GTM, click on Preview to activate the debug mode.
  2. Load your website in a new tab with the debug panel open.
  3. Check if the Twitter UWT tag fires correctly by performing the actions you want to track (e.g., page views, clicks, purchases).
  4. Verify that the page view and any custom event tags (like purchases or clicks) show up as expected in the Preview mode.

Step 6: Publish the Changes

Once you’ve verified that everything works correctly in Preview Mode, it’s time to publish the changes:

  1. In Google Tag Manager, click on Submit to publish your new tag and triggers.
  2. Your Twitter Universal Website Tag is now live on your website.

Step 7: Monitor Conversions in Twitter Ads

Once your Universal Website Tag is properly implemented and the data is flowing, you can monitor the performance of your ads and conversions in the Twitter Ads Manager under the Conversion Tracking section. You’ll see metrics related to the events you’ve set up (e.g., page views, purchases, or form submissions).

Conclusion

Implementing the Twitter Universal Website Tag using Google Tag Manager is a straightforward process. By following the steps above, you can track conversions and key events on your website without modifying the website’s code directly. GTM allows you to manage and deploy this tag easily, while enabling you to track user behavior, optimize Twitter ad campaigns, and measure your return on investment (ROI).

Categories: Digital Marketing