• GTM Courses
  • Blog
  • Services
  • Resources
    • Youtube channel
    • E-books and Guides
    • GTM Recipes
    • View All Resources
    • GTM Community
  • About
    • About
    • Contact
  • GTM Courses
  • Blog
  • Services
  • Resources
    • Youtube channel
    • E-books and Guides
    • GTM Recipes
    • View All Resources
    • GTM Community
  • About
    • About
    • Contact

August 3, 2020

A Guide to Referrer in Google Tag Manager

Updated: August 3rd, 2020. When you create a new Google Tag Manager, you’ll see several built-in variables that are enabled by default. One of them is Referrer. What it is and why is it useful? Let’s find out.

 

Table of contents

  • What is Referrer in Google Tag Manager?
  • Where can I find the Referrer in Google Tag Manager?
  • Be aware of the limitations
  • How to identify issues if the Referrer is not returning what you expect
  • A couple of use cases for Referrer in Google Tag Manager
    • #1. Multiple landing pages with forms that redirect to the same “Thank you” page
    • #2. Prevent random visits to your “thank you” page
  • Frequently asked questions
  • Final words

 

What is Referrer in Google Tag Manager?

In a nutshell, Referrer is a GTM variable that returns a URL of the previous page that a visitor visited. So, for example, if I am browsing the site and go from example.com/page1 to example.com/page2, the value of the Referrer will be example.com/page1 (because that is the value of the previous page’s URL).

Does this variable work only when I navigate pages between my own website? Not only that.

Is it possible to see the previous page if the visitor just landed on my site from another website? Yes, but to some extent. Due to privacy concerns, more and more limitations are affecting the Referrer. Not just GTM, but in general. The referrer is not just some GTM-specific thing. It is globally available on any website and anyone can access that value. That’s just how the web works.

However, there are more and more limitations introduced to referrer. Keep reading.

P.S. Your Google Analytics Acquisition reports are heavily relying on referrer too!

Google Tag Manager Ebook Bundle

Where can I find the Referrer in Google Tag Manager?

There are multiple ways to skin a cat here. The most standard way is just to use the built-in variable. In your GTM container, go to Variables and in the Built-in Variables section, you will find the variable.

You can also create a user-defined variable. Go to Variables > User-defined Variables > New > HTTP Referrer. In this case, you can additionally extract a particular component of the referrer, e.g. just the hostname.

One more option is to create a JavaScript variable (NOT Custom JavaScript) and enter the following value (without quotation marks) — document.referrer.

But this will work pretty much in the same way as the built-in variable (therefore, no need to create a user-defined var).

 

Be aware of the limitations

This variable sounds awesome, right? You could fire tags based on the page your visitor came from. For example, if a visitor lands from a particular 3rd party page, you can fire a tag that shows a specific popup.

However, Referrer is being limited more and more (due to privacy concerns) because Referrer is being more and more heavily used for cross-site tracking. And gatekeepers like Brave or Safari (but not limited to) are making sure that this becomes much more difficult.

In fact, the limitations are constantly changing and if you want to stay up-to-date, bookmark cookiestatus.com.

Here is a snapshot of how Referrer is being handled by popular browsers (click the image to see it in higher resolution).

Let me explain some parts of the screenshot above:

  • Default browser policy means that if a visitor navigates from https://www.some3rdpartywebsite.com to http://www.yourwebsite.com, the referrer will be removed. It will not return any value. Why? Because the visitor navigated from HTTPS (secure) website to HTTP (insecure).
  • Strip all cross-origin referrer to origin means that is a visitor goes from https://www.otherwebsite.com/posts/example to https://www.yourwebsite.com, the referrer will show only https://www.otherwebsite.com (/posts/example will be removed). So basically, you will be able to know just the domain but not the exact page from which the visitor landed on your site. Update: Chrome 85 (and newer versions) will start applying this policy.
  • eTLD+1 means the Top-level Domain (TLD) (e.g. .com, .co.uk, etc.) and one additional level (e.g. amazon.co.uk or cnn.com).

 

How to identify issues if the Referrer is not returning what you expect

First of all, let’s quickly take a look at referrer policies. They define what kind of data will the website pass in a Referrer.

  • no-referrer (this means that no referrer will be passed (in other words, it will be empty in GTM)).
  • no-referrer-when-downgrade (if a visitor navigates from an HTTPS page to HTTP, the referrer will be dropped. It will be empty in GTM)
  • origin (this means that referrer will always return only the hostname (e.g. www.example.com) of the previous page)
  • origin-when-cross-origin (if a visitor navigates between different subdomains, e.g., a.domain.com and b.domain.com, only the hostname will be returned. If a visitor navigates from a.domain.com/page1 to a.domain.com/page2, the referrer will return the hostname, path, and query strings.
  • same-origin (referrer will be available only if a visitor navigates between pages of the same subdomain)
  • strict-origin (referrer will return value only if the visitor navigates from HTTPS to HTTPS
  • strict-origin-when-cross-origin (returns hostname, page path, and query strings only when a visitor navigates on the same subdomain and from HTTPS to HTTPS). For example:
    • if a visitor navigates from www.example.com/pagepath to www.anotherdomain.com, the referrer will be just www.example.com (without /pagepath)
    • if a visitor navigates from blog.example.com/pagepath to www.example.com, the referrer will be just blog.example.com (without /pagepath).

      Update: These changes start to apply for Chrome 85+.

  • unsafe-url (Referrer will always return a hostname, page path, and query strings. This is unsafe because the URL might contain sensitive data like email address, etc.)

You can learn more about the policies here.

Anyway, if you see an empty referrer way too often in your GTM preview mode, here are some ideas of what things to check (or if it returns the value that you did not expect):

  • First of all, analyze the table I’ve previously shared. There are many browsers and they each treat the Referrer differently. Rule of thumb, don’t rely on Referrer in GTM if you try to use very specific URLs of the previous page that does not belong to the same hostname. Otherwise, you’ll face various behaviors and inconsistencies in your data.
  • Check what kind of referrer policy is implemented on your site. There are different ways of how that can be implemented:
    • Directly in the hyperlink. If the clicked link (in the previous page) container “rel=noreferrer”, referrer on the destination page will be empty. Check that with the “Inspect element” in browser’s developer tools. Right-click on the link > Inspect Element:
    • Directly in the hyperlink (2). Also, referrer-policy might be implemented in the clicked link by adding an attribute referrerpolicy=”someValue”, e.g. referrerpolicy=”no-referrer” (in this case, Referrer will also be empty).
    • Meta tag on the page. For example, if the previous page had a meta tag <meta name=”referrer” content=”origin”>, the referrer will only return the domain of the previous page. There are other possible values/settings of this meta tag. You can learn more about them here. Where can you find this meta tag? In the source of your site. Right-click somewhere on the previous page > View source and then somewhere in the top of the code you should be looking for the referrer meta tag.

      If no policy is defined, the default will be used (no-referrer-when-downgrade), unless the browser is configured differently.

You can learn more about all of this here.

 

A couple of use cases for Referrer in Google Tag Manager

For inspiration, here are several ideas where you can possibly use the Referrer in your GTM setup.

 

#1. Multiple landing pages with forms that redirect to the same “Thank you” page

Let’s imagine that you have 20 landing pages with opt-in forms, for example:

  • https://www.example.com/lp/landing-page1
  • https://www.example.com/lp/landing-page2
  • ……
  • https://www.example.com/lp/landing-page20

When a visitor submits the form, he/she is redirected to the same Confirmation page (a.k.a. “Thank you” page). The URL is always the same for all submissions, regardless of the form: https://www.example.com/thank-you

How can you track form submissions and identify which form was submitted? You can send the value of the Referrer with every GA event, like here:

In this example, Event Label will contain the URL of the previous page (the landing page where the form was submitted). Problem solved!

 

#2. Prevent random visits to your “thank you” page

The problem with “Thank you” pages is that on some websites, they might be accessed a little too easily. For example, Google bot may have indexed that “Thank you” page. Maybe due to mistake, even your website’s search is displaying that “Thank you” page in search results (obviously, your developers should fix that).

Let’s go back to my previous example with 20 landing pages. Let’s imagine that the only PROPER way to land on the “Thank you” page should be after the form is submitted on one of those 20 landing pages.

Every URL of the Landing page contains /lp/ in the page path. Why don’t you update your Pageview trigger in GTM (that activates on the “Thank you” page) and configure it to fire only if the previous page contained /lp/ ?

In that case, random visits from other parts of the site or other traffic sources will not cause false positives.

 

Frequently asked questions

Here are several questions I’ve noticed recently being asked online, so I thought to address them as well.

Can I access the previous page’s title? There is no easy way to achieve that. The referrer is related only to the URL of the previous page, not other attributes (like Title). If you want to access the previous page’s URL, you would need to write some custom JS code that temporarily stores the previous page’s title. Another option is to ask a developer to push this information to the Data Layer.

Can I access the URL of the page that was visited before the previous page? In other words, is it possible to access the URL of 2+ pages ago? There is no easy way for that. You would also need to write some custom code that stores the info in the cookie or browser storage. Or once again, contact developers to push this info to the Data Layer.

 

Final words

A referrer is definitely a handy variable in GTM, however, you should be very much aware of the privacy-and-security-related limitations that can be implemented on a site or that can be introduced by browsers (such as Safari or Brave).

My rule of thumb:

  • try to use Referrer in your GTM tags or triggers only, when things are happening on the same main domain of your website (just like in the examples I’ve shared above).
  • If you want to know the previous page (that was on a 3rd party website), always be expecting only the hostname (domain) at best. Don’t build triggers based on a specific page of the 3rd party website (with page paths and query parameters). Even though that works fine on Chrome, a browser like CliqZ strips the referrer and only returns the hostname (without page path or query parameters). Actually, it looks like quite soon more browsers will follow the same way.

Also, keep an eye on cookiestatus.com. More limitations will be introduced in the future, so you should stay up-to-date.

Got any questions? The comments section is at your service.

Google Tag Manager Ebook Bundle
Julius Fedorovicius
In Google Tag Manager Tips
10 COMMENTS
Charles Meaden
  • Mar 17 2020
  • Reply

We use to track all the people who directly arrive on a 404 page so that we can the identify the source and suggest a better page

Also very handy to identify which pages contain bad links

    Julius
    • Mar 17 2020
    • Reply

    Nice idea!

Adil
  • Mar 28 2020
  • Reply

I liked the second idea: #2. Prevent random visits to your “thank you” page. Will be adding a referrer condition to prevent direct landings there.

Jess
  • May 21 2020
  • Reply

Hi! Helpful article :)
What about this use case:
To validate a form submission, a user clicks on a confirmation link from an email received earlier. This leads the user to a "Thank-You" page.
How to avoid tracking accidental pageView here? In this case, the referrer will be empty (more accurately, what is shown in The Google Tage Manager Preview Debug window is ''). What rule should be specified in the trigger to avoid firing the tag in that scenario?
There is no such rule as Referrer Is Empty, which would have done the job here.
Thank you for considering that case :)

    Julius
    • May 21 2020
    • Reply

    Ask a developer to add UTM parameters to the confirmation link and use that in your trigger.

Paulien
  • Oct 1 2020
  • Reply

Hi there, I have a question. When I use {{referrer}} to register the previously visited page, it takes along the URL parameters if there are any. For instance, the previous page had "?utm_campaign=Advertisement&utm_source=LinkedIn" in its URL and that is how it's captured in the referrer variable. How would I ensure the referrer records the URL without parameters?

    Julius
    • Oct 1 2020
    • Reply

    You'd need a custom JS variable for that and write code. Or install the URL variable 2.0 from the custom variable template gallery

David
  • Nov 19 2020
  • Reply

Hi Julius, great post like always.
I have a form that redirects to the same page (via the variable action of the form), then, if the subscriber is saved successfully, this second page (which is the same as the first one, the page with the form) is redirected to a third page (the thank you page) via javascript. Should I edit the 'action' attribute of the form to send the user directly from the first form page to the thank you page? Or does it work if the second page (which is the same as the first one) is redirected to the thank you page via javascript when the subscriber is saved successfully?
Is the referrer method useful in this case?
Thank you very much.

Roi
  • Nov 23 2020
  • Reply

Hey Julius,

I am trying to get a referrer variable of the previous URL of each event on my tag manager (My web app is a Single Page Application). Unfortunately, the referrer only points to the https://tagassistant.google.com/' when I use the preview mode of tag manager. I cant see any change when I navigate and the URL path is switching.

Any Idea why it doesn't works ? there is any tutorial can help me define such variable ?

Mr. KingsHOK
  • Feb 23 2021
  • Reply

Thanks for this guide altogether, but can i use this to check mailchimp as well?

Leave a comment Cancel reply

Your email address will not be published. Required fields are marked *

 

Hi, I'm Julius Fedorovicius and I'm here to help you learn Google Tag Manager and Google Analytics. Join thousands of other digital marketers and digital analysts in this exciting journey. Read more
Essential resources


Popular articles
  • 🔥 GTM Form Tracking: 7 Effective Methods
  • 🔥 dataLayer.push: The Guide
  • 🔥 GTM vs Google Analytics
  • 🔥 99 Things You Can Do with GTM
  • 🔥 Common GTM Mistakes
  • 🔥 Data Layer: Ultimate Guide
  • 🔥 60+ Custom JavaScripts for GTM
Analytics Mania
  • Google Tag Manager Courses
  • Google Tag Manager Recipes
  • Google Tag Manager Resources
  • Google Tag Manager Community
  • Login to courses
Follow Analytics Mania
  • Subscribe to newsletter
  • RSS feed
Recent Posts
  • 5 Ways to Track Site Search with Google Tag Manager and Google Analytics 4
  • How to Downgrade from Google Analytics 4 to Universal Analytics
  • How to Track Events with Google Analytics 4 and Google Tag Manager
Analytics Mania - Google Tag Manager and Google Analytics Blog | Privacy Policy
Manage Cookie Settings