Skip to main content
  1. Blog Post/

Tracking Disqus activity with Google Tag Manager

2 min · 1266 words
Table of Contents

Today we're starting a new serie of posts about how to track things with Google Tag Manager en Inside-GTM. So this time we're going to learn how we can measure our visitors interactions with the Disqus Comments System.

The posts are going to be structured this way:

    Tracking Flow

      Tags, Rules and Macros

      Disqus needs to have the callbacks defined before it loads. That's is something that we can't control in some cases, so in order to have it working in all cases, We are using Disqus API to reload their iframe with our new callbacks configuration when the page has been loaded. We are going to track for now new comments, when a visitor uses the pagination and when an users logs in into Disqus. After the visitos performs any of those actions we're pushing the needed data to the dataLayer so we can configure a Event Tag to send that info to Google Analytics.

      Tag

      Rule

      In this case we're going to use just one rule, that will need to match 2 conditions:

        Macros

        Finally we're going to create a new Macro ( the one we were using as a condition on the tag firing rule ) , that will return "true" if Disqus iframe is available on the page DOM's.

        So now, everytime that a visitors leaves a comment , or performs any of the defined actions, our dataLayer will populated with that interaction data. We just need to fire an event based on the info available in the dataLayer.

        Source Code:

        function()
        {
            // Let's see if disqus embed iframe is available on the DOM, We don't want
            // to fire it in pages where it is not available
            var iframes = document.getElementsByTagName('iframe');
            for (var i = 0; i < iframes.length; i++) { if(iframes[i].src.indexOf('//disqus.com/embed/comments/')>-1)
                   return true;
            }
        }