Incredible SEO Tasks you can do With Google Tag Manager

Share this post

Google Tag Manager is a fantastic tool to give SEOs the flexibility to test SEO modifications to stuff like meta descriptions, structured data, and canonicals.

Bear in mind that this should be temporary changes that will at some point be implemented by the development team.

Tags injected by JavaScript are considered less reliable and there is a considerable chance that Google will ignore them.

It is also good to know that the more JavaScript-heavy your content is, the longer it will take (if ever) for your SEO changes to be indexed by Google.

Don’t Have Google Tag Manager?

Don’t worry.

You can follow this tutorial by opening any website and going into the Chrome Devtools JavaScript console by typing Command + Option + J (on Mac) or CTRL + SHIFT + J (on Windows).

Any function you add in the JavaScript console.

Modify Title

You can do SEO Split Test changes to the meta titles using Google Tag Manager. Even better, you can implement dynamic meta tags to your site for SEO split testing purposes.

<script>
    document.title = "Your Meta Title";
</script>

Modify Meta Description

Use this script to modify your meta description.

<script>
var metaRobots = document.querySelector('meta[name="description"]');
if (!metaRobots) {
  metaRobots = document.createElement('meta');
  metaRobots.setAttribute('content', 'Your meta description');
  document.head.appendChild(metaRobots);
}
metaRobots.setAttribute('content', 'Your meta description');
</script>
   

Modify Rel Canonical

There is a great post on Moz that shows you how to insert rel=canonical on your website using Google Tag Manager.

The only problem that I saw with their solution is that it pushes the Rel=canonical but does not remove the one that was already there, resulting in two canonical tags on the same page.

If for testing purposes you’d like to modify the canonical tag, you should use this script when creating your tag. To learn more about querySelector, just watch this video.

<script>
document.querySelector("link[rel='canonical']").setAttribute("href", {{Page URL Canonical}});
</script>

However, this is not a proper way to implement canonical, because it does not mean that other search engines will be able to read your tag.

This tag was implemented via JavaScript. So, it means that the old canonical tag is still leaded via HTML first and then changed when Googlebot comes back to crawl JavaScript.

For example, I had relative URLs used for canonical, and I wanted to see the impact of changing them to absolute URLs.

I pushed the new canonical and looked at the DOM.

Success!

But, when you look at the source code by pressing CTRL+U. You see that the canonical loaded in the HTML is still the relative URL.

This is why it is good for testing purposes, but when it is done, make sure that canonicals are properly implemented and not sent via Google Tag Manager.

Add a Script to the Header

When you simply add a custom HTML tag in Google Tag Manager, it will be added to the body of the page. To add a script between the opening <head> and the closing </head> html brackets, you need to create a function.

<script>
  (function() {
    var s = document.createElement('script');
    s.innerHTML = "function(){//create your own function here};";
    document.head.appendChild(s);
  })();
</script>

Add a Style Tag to the Header

Similarly, you can add a style tag to the header of your web page.

<script>
  (function() {
    var j = document.createElement('style');
    j.innerHTML = ".yourclass {color:blue !important}";
    document.head.appendChild(j);
  })();
</script>


Add Noindex to a Page

<script>
var metaRobots = document.querySelector('meta[name="robots"]');
if (!metaRobots) {
  metaRobots = document.createElement('meta');
  metaRobots.setAttribute('content', 'noindex');
  document.head.appendChild(metaRobots);
}
metaRobots.setAttribute('content', 'noindex');
</script>
    

Add Nofollow to External Links

If you want to test if nofollowing external links is good for your SEO performance, you can do so by using this script.

<script>
function toNofollow() {
var x = document.getElementsByTagName("a");
var i;
for (i = 0; i < x.length; i++) {
if (location.hostname!=x[i].hostname){
x[i].rel = "nofollow";
}}}
mft=setTimeout("toNofollow()",0);
function LoadEvent(func){
var oldonload = window.onload;
if (typeof window.onload != 'function'){
window.onload = func;
}
else{
window.onload = function()
{
if(oldonload)
{oldonload();}
func();}}}
LoadEvent(function(){
toNofollow();
});
</script>

Just choose all the pages where you would like to run it as a trigger.

Convert Relative to Absolute URLs

If the website was developed using relative urls (/page-path) instead of absolute URLs (https://www.example.com/page-path), you might end up with a problem where Google can’t read your canonicals.

Wrong Canonical Tag in Google Search Console
Wrong Canonical Tag in Google Search Console

To modify this for all your pages, you need to activate the built-in “Page Hostname” variable.

Go to Variables > Built-in Variables > Configure and click on the Page Hostname Checkbox.

Activate Page Hostname Variable
Activate Page Hostname Variable

Then, create another variable for the current alternate tag on your page.

Go to Variables > User-Defined Variables > New and select Custom JavaScript as the variable Type.

function myFunction(){
  a=document.querySelector("link[rel='canonical']").getAttribute('href');
  return a;
}
current alternate tag variable
Create a variable for your current alternate tag

Now, you can create a new Tag to modify your relative Canonical to an Absolute URL. Go to Tags > New > Custom HTML and add this script.

<script>
var s = document.querySelector("link[rel='canonical']");
if (!s) {
  s = document.createElement('link');
  s.setAttribute('rel', 'canonical');
  s.setAttribute('href', 'https://{{Page Hostname}}{{Page Path}}');
  document.head.appendChild(s);
} else {
s.setAttribute('href', "https://{{Page Hostname}}{{Current canonical}}"); }
</script>
Modify Canonical Tag With GTM
Modify Canonical Tag With GTM

Other Useful Resources

This is it!

Let me know if you know other SEO Tasks that you can do with Google Tag Manager.