This post will describe methods to implement google analytics cross domain tracking with gtag.js. I have written in detail about what is global site tag (gtag.js) and the difference between universal analytics (analytics.js) and global site tag (gtag.js).  Following will be dedicated to how gtag.js cross-domain tracking works and what type of changes we need to make in global site tag (gtag.js) tracking code.

What is Cross-Domain Tracking

If you want to track two different domains into one google analytics property, it can be done with google analytics cross-domain tracking. Cross-domain tracking makes it possible for Analytics to see sessions on two related sites (such as an e-commerce site and a separate shopping cart site) as a single session. This is sometimes called site linking.

To track users activity google analytics generates a unique client ID, a user is considered as returning use is client ID matching with client ID which is already send to the same property.

For cross-domain tracking google analytics shares client ID between the source domain and destination domain.  The client ID which is stored in browsers cookies needs following steps to be shared with other domains.

  1. The source domain needs to ensure all URLs pointing to the destination domain contain the client ID of the source domain.
  2. The destination domain needs to know to check for the presence of a client ID in the URL once a user navigates there.

Cross-domain tracking with gtag.js

Gtag.js cross-domain tracking works by adding linker parameter to URLs that point to the destination domain. This linker parameter will contain two things 1) Client ID 2) Current timestamp and browsers metadata.

Example of Linker parameter:

_ga=1.199239214.1624002396.1440697407

When the user clicks on a link or filled a form and went to destination domain where cross-domain tracking is set up, gtag.js will first check for linker parameter in the URL. If the linker parameter is found and is valid, gtag.js extracts the client ID from the parameter and stores it.

The advantage with gtag.js is that it allows both automatic and manual adding of linker parameter.

There are several ways by which cross-domain tracking can be set up with a gtag.js tracking code. Let’s discuss all these methods one by one.

Automatically link domains

To accomplish automatics cross-domain tracking with gtag.js the source domain for URLs pointing to the destination domain, configure the domains property of the linker parameter in your property’s config.

If you have forms on your site pointing to the destination domain, set the optional decorate_forms property of the linker parameter to true.

Example:  Given code will automatically add linker parameter to any link on the page that points to destination domain ‘seconddomain.com’

Complete Cross-domain tracking code

Configuring a site to accept linker parameters

If a user is visiting destination domain with linker parameter in URLs then gtag.js of destination domain need to know to look for the linker parameter.  Destination domain will accept linker parameter by default if it is linked automatically.

You need to add some additional code to instruct destination page to look for linker parameter if it is not configured automatically. Add an accept_incoming property of the linker parameter to true on the destination property’s config:

Bi-directional cross-domain tracking

Above given methods are single-directional cross-domain tracking because traffic going from source domain to destination domain.  But, there can be a situation where traffic can come from any direction, in this type of situation bi-directional cross-domain tracking is required.  In this type of tracking any one domain can work as source or destination.

On source.com, update the property’s config:

Complete code

On destination.com, update the property’s config:

Complete code

Set up reporting views and add filters

After gtag.js tracking code set up, you need to create addition view for your web property in google analytics admin panel by using google analytics filters. This is quite similar to cross-domain with universal analytics (analytics.js).

Why separate view with filter required?

By default, google analytics shows page path and page name in its report. For example, you may see the following type of page path in analytics report

/about-us.html

/contact-us.html

Now, since we are tracking two or more domain in the same property, it might be hard to tell which domain each page belongs to.  So, it’s become necessary to display domain name in google analytics report.  To display domain names you need to do following two things

  1. Create a new reporting view that includes data of all domains in it.
  2. Add an advanced filter to this view.

Example of filter setting is given below

Filter Type: Custom filter > Advanced

Field A: Hostname Extract A: (.*)

Field B: Request URI Extract: (.*)

Output To: Request URI Constructor: $A1$B1

Add your domains to the referral exclusion list

After completion of all above given steps, don’t forget to add your domains in referral exclusion list otherwise you will see your domains as a referral in traffic source report.  Follow given steps

  1. Go to admin setting
  2. Property –> Tracking info
  3. Click on Referral Exclusion List
  4. Add your all domains here which are involved in cross-domain tracking.

Conclusion

Cross-domain tracking with global site tag (gtag.js) is very similar to universal analytics (analytics.js) with changed syntax.  I must say that cross-domain tracking becomes little easier now, gtag.js provides new options like automatic linker, single-directional and bi-directional cross-domain tracking.