How to Redirect a URL Using Google Tag Manager (Solution)

by

This guide explains how to redirect a URL using Google Tag Manager.

Google Tag Manager, also known as GTM, is a tag management system that enables you to deploy snippets of code on a website without editing the source code.

This tutorial will give you step-by-step instructions on how to set up redirections with Google Tag Manager using custom HTML tags and tag sequencing. You’ll also find a solution that allows a user to be tracked by Google Analytics and GTM before they’re redirected to an external page.

How to Redirect a URL Using Google Tag Manager

How to Redirect a URL Using Google Tag Manager

To redirect a URL using Google Tag Manager you can create a custom HTML tag with the redirection code, then use tag sequencing to trigger the redirection tag.

Here’s an example redirection code for the HTML tag:

<script>
window.location.href = "https://www.insert-redirection-here.com";
</script>

Creating a Custom HTML Tag

  1. Click Tags >  New.
  2. Click Tag Configuration.
  3. Select Custom HTML.
  4. Paste the tag code into the HTML field.
  5. JavaScript must be wrapped inside <script></script> HTML tags.

If needed, select Support document.write to enable calls to document.write() in your JavaScript code.

To add a GTM variable in the custom HTML, wrap the variable’s name in double braces:

<script>
var foo = {{bar}};
</script>

Setting Up Tag Sequencing

Tag sequencing is a Google Tag Manager feature that enables you to specify setup and cleanup tags to fire immediately before or after a primary tag is fired.

Follow these steps to configure a setup tag:

  • Go to Advanced Settings > Tag Sequencing.
  • Select the “Fire a setup tag before <this tag> fires” checkbox. Note: “<this tag>” will be replaced by the title of the current tag.
  • Select the tag you want to use from the menu.

According to Google Tag Manager’s tag sequencing documentation, “Developers must use google_tag_manager[{{Container ID}}].dataLayer.set() to change data layer values from the setup tag. You need to use .set() instead of .push() because the .push() won’t get recognized by Google Tag Manager until the following event. Using .set will allow the event to be captured by the current event.”

Another solution for redirecting a URL using Google Tag Manager comes from Stack Exchange. This code below will enable a user to be tracked by Google Analytics and Google Tag Manager before they are redirected to an external page. It also makes it easy to add the redirect data layer tag to any page on the site.

Here’s the code for this redirection:

<script type="text/javascript">
    dataLayer.push({
        'event': 'gtm_redirect_url',
        'gtm_redirect_url': '<?php echo $url; ?>'
    });
</script>

Then in Google Tag Manager, you need to set up a variable called gtm_redirect_url. Next, add a trigger called gtm_redirect_url. And a tag to fire the JS in the HTML snippet:

<script>
     setTimeout(function() {
          window.location.href = '{{DL - Redirect URL}};
     }, 200);
</script>

Redirect a URL Using Google Tag Manager Summary

I hope you enjoyed this guide on how to redirect a URL using Google Tag Manager.

As you discovered, the solution for setting up redirections with Google Tag Manager uses Javascript code that’s placed inside custom HTML tags and tag sequencing to make sure the GTM tag fires before the primary tags on a website.