How to make triggers in your Mobile Directory?

Some people register a lot of tags and triggers in one container after having used Google Tag Manager for a long time. As for myself, I have an account that has more than 150 tags, triggers and variables registered. In this situation, it is difficult for someone to take over the account. Furthermore, I even cannot understand the whole structure.

In this article, I would like to introduce a way to avoid making triggers complicated in a website. Let me pick up the example of mobile directory.

Example: Complecated triggers by mobile directory

Website structure

First of all, let’s consider the case that a website structure has mobile directory such as “http://example.com/sp/index.html”. In this case, what can you do when you execute a specific tag on a top page and on a contact complete page?

I guess that the most popular ways are creating triggers for both desktop and mobile respectively and using regular expressions in trigger configuration.

Method 1: Creating triggers for both desktop and mobile respectively

The most popular way is to create two triggers for both top page of desktop site and that of mobile site. Besides, set those triggers by tag settings. For example, please see the image below.

In this way, the number of triggers ends up in being huge just like the image below. This happens because we normally want to implement tags not only at top pages but also at other pages.

Method 2: Using regular expressions in trigger configuration

Another method that we can come up with is here. Please see the image as an example below.

However, in this method, we need to use regular expressions. They are powerfull but complex. Because of this, you had better not use it if possible.

Solution

To solve these matters, you only need to create ONE variable.

The variable is a bit complicated, so you need to use Custom JavaScript to create. You do not need to be a professional engineer because the code has only 8 lines and there is only one change necessary for your website.

A role of new variable

The biggest issue is that the value of the variable “Page Path” differs according to the type of website(desktop or mobile). Therefore, we need to create the variable that can gain “Page Path” which skips the mobile directory “/sp/”.

In this way, the value of variables will be the same for both desktop and mobile websites. Thus, we do not need to be careful for the type of websites when creating triggers.

JavaScript code of variable

So, what we do? Here is the Custom JavaScript code. Please select “Custom JavaScript Variables” in setting and write below code in textbox. Please set the name as “Page Path – SP Integration” to understand easily.

In this script, we set the mobile directory as “sp”. If not, please change “sp” of “var dirname = ‘sp’;” in line no.3 to your sites.

// Page Path - SP Integrate
function () {
  var dirname = 'sp'; // to change
  var pathname = {{Page Path}};
  if (pathname.substr(0,dirname.length + 2) == '/' + dirname + '/') {
    return pathname.substr(dirname.length + 1);
  }
  return pathname;
}

Using trigger

In trigger, you can use “Page Path – SP Integration” instead of default “Page Path”. If you use it, you can set the trigger without worrying about the URL structure of the desktop and mobile. As a result, you can reduce the number of trigger without using a regular expression.

When you need a specific trigger for desktop site or mobile site, you can just use the default “Page Path” variable for it. You don’t need anything other than that.

Comparison

Conclusion

You do not need to be a professional engineer to implement tag manager, which is a simple and convenient tool. However, if you use it in a reckless way, no one else can understand the setting environment with huge number of tags and triggers.

In order to avoid this, let’s try to implement tags as simply as possible. Besides, the most important element for this is of course variable!