How to track content Statistics for Facebook Instant Articles with Google Analytics

19,728

Solution 1

According to their documentaion https://developers.google.com/analytics/devguides/collection/gajs/gaTrackingCampaigns#generalCampaign It is possible to set the source, medium and title through the analytics script. the title it is needed to be set given that the page title for the IA on the FB app is null.

PLEASE NOTICE THE CAPITAL LETTERS in the code are supposed to be updated with you static or dynamic values for it.

<figure class="op-tracker"> 
    <iframe hidden>
        <script>
            (function (i,s,o,g,r,a,m) {i['GoogleAnalyticsObject']=r;i[r]=i[r]||function () {(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),                         m=s.getElementsByTagName(o)0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-   analytics.com/analytics.js','ga');
            ga('create', 'ANALYTICS ID', 'auto');
            ga('require', 'displayfeatures');
            ga('set', 'campaignSource', 'Facebook');
            ga('set', 'campaignMedium', 'Social Instant Article');
            ga('set', 'title', 'POST TITLE OR THE TITLE YOU WANT'); 
            ga('send', 'pageview');
        </script>
    </iframe>
</figure>

Again, Please Notice That THE CAPITALIZED WORDS are to be replaced by your actual values. Enjoy it.

Solution 2

As it seems this is a common issue I'll try to provide more information here:

First, make sure you check whatever code you are using on your Analytics. The first answer provided here pasted a code using Google GA.JS code, but many websites today uses the new Analytics.JS code (my case). So my suggestion is to copy your GA code from your website or from your GA panel.

Second, check if your GA code is being passed on your Instant Article RSS feed correctly (i'm assuming you are using Wordpress with some plugin to build a RSS). If you are using the new analytics.js method the code inside your RSS feed (per article) should be like this:

<!-- Adding tracking if defined -->
<figure class="op-tracker">
    <iframe>
        <script>
            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
            (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
            })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
            ga('create', 'YOUR_GA_ID', 'auto');
            ga('send', 'pageview');
        </script>
    </iframe>
</figure>

Third, if your articles were already on Facebook Instant Article Production list BEFORE you added the Analytics code, they will NOT update / load the code. The best way to test is to edit any of your articles (a simples change of punctuation is enough) and republish it on your wordpress. Then go to your IA panel on Facebook, Configuration and click to reload / rebuild your RSS. Wait a little then check on the list of I.A that the post will update (you will see the date change), then open it on the edit option and check at the end of the code. Your GA code should be there.

So, if everything is good now, your last step (at least was for me) is to delete all the old Instant Articles on Facebook (I'm assuming you don't have them published yet) and reload the RSS feed on the Configuration area, so it will rebuild your articles with the GA code on them.

Hope this helps.

PS: I'm NOT using the plugin from Automattic to publish IA from WP as it's just garbage. There is one way simpler that work's w/o any trouble: https://wordpress.org/plugins/allfacebook-instant-articles/

Solution 3

Most of the answers here mention hardcoding campaignSource and campaignMedium.

If you do this, your analytics will miss recording any specific campaigns using UTM tags. Also, Google Analytics will treat all your traffic to Instant Article as Campaigns and numbers won't come under "Social" Traffic.

The solution is to set the referrer to https://i.facebook.com/. Using this Google Analytics will treat your traffic is coming from Facebook and behave as if it is "Social" traffic.

To distinguish Instant Article Traffic from regular Facebook traffic you can filter on referrer or add custom dimensions.

Do remember to change XX-X and in the following snippet.

<!-- Google Analytics Tracker -->
      <figure class="op-tracker">
          <iframe src="" hidden>
            <script>
              (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
              (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
              m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
              })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

              ga('create', 'UA-472932XX-X', 'auto');
              ga('set', 'referrer', 'https://i.facebook.com/');
              ga('send', 'pageview', {title: "<page-title>"});
            </script>
          </iframe>
      </figure>

Solution 4

Unfortunately the other answers all involve some kind of mess that will likely confuse people. Here's an attempt at a solid, modern solution that uses UNIVERSAL ANALYTICS (the new one) rather than "ga.js" (the old one, though there is an even older one urchin.js that no one uses anymore).

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'YOUR_UID_REPLACE_THIS', 'auto');
  ga('require', 'displayfeatures');
  ga('set', 'campaignSource', 'Facebook');
  ga('set', 'campaignMedium', 'Social Instant Article');
  ga('set', 'title', ia_document.title);
  ga('send', 'pageview');

</script>
  • YOUR_UID_REPLACE_THIS: Obviously put your personal GA code here.
  • campaignSource: Shows up as "Source" in GA.
  • campaignMedium: Shows up as "Medium" in GA.
  • ia_document.title: This uses the FB javascript variable for title.

So far for me the title gets successfully replaced for me with this code.

I had some very confusing experiences trying to test this with the "REAL-TIME" report on Analytics, where multiple posts were showing up with the same title, but overall I think it's working.

  • To test the 'title' field: REAL-TIME > BEHAVIOR
  • To test the 'Source' and 'Media' fields: REAL-TIME > TRAFFIC SOURCES

To see the traffic under the Acquisitions section of GA, go to Acquisitions > Source / Medium where it will be listed along with other sources (including several different ones from facebook).

FLAW (shared with all the other solutions) - Unfortunately my solution doesn't get IA traffic to show in the Acquisitions > Social > Facebook report. Even worse, it doesn't even show in the Acquisitions > Social report. Sadly, it gets lost in Acquisitions > Other, and for most of us, will mean a totally messed-up Social report overall.

  • The "Social" channel, like other channels, has a very precise set of source / medium values that it will filter into the different categories like Facebook.
  • Clearly, Facebook / Social Instant Article isn't on that list.
  • See This other StackOverflow post I made about this particular issue for more details. I will update my example here with whatever turns out to be the best practice.

Source for ia_document.title code: https://developers.facebook.com/docs/instant-articles/analytics

Share:
19,728
aimiliano
Author by

aimiliano

Languages:Php, Css,css3,html4,html5,Js,Jquery,Java,ASP.NET C#,Linux Scripting

Updated on June 17, 2022

Comments

  • aimiliano
    aimiliano almost 2 years

    Hello we have setup the Facebook Instant Articles feeds in facebook.

    Facebook's Instant Article feature for publishers (rolled out on FB iOS apps mostly for now 30 3 2016) allows tracking by Google Analytics code. However, even after implementing GA code as instructed, we are not able to locate the referral or other info of FB Instant Articles in GA. Can anyone help me understand where exactly to find information in GA about content consumption on Facebook Instant Articles?? Will it appear as a referral source or a hostname? Instant Articles open inside FB.

  • aimiliano
    aimiliano about 8 years
    I follow the instuctions over here developers.facebook.com/docs/instant-articles/… but it doesnt work. Facebook parser is not accepting <figure class="op-tracker"> <iframe> <!-- Include full analytics code here here i put your code --> </iframe> </figure>
  • neoplomero
    neoplomero about 8 years
    Did you put your full analytics code between the script tags ? I just edited my code to use the script tags so try again and let me know ;)
  • aimiliano
    aimiliano about 8 years
    yes i did put it in <script> tags but facebook parser warns me that it is not correct
  • neoplomero
    neoplomero about 8 years
    Would you please share your code so I can help you spotting what you're doing wrong
  • Jeremy Hicks
    Jeremy Hicks about 8 years
    Everything in the script tags is showing up as if it were page markup for me in development mode when I view my test stories. I get no warnings from the parser.
  • neoplomero
    neoplomero about 8 years
    Try Adding the attribute hidden to the iframe. <iframe hidden>
  • aimiliano
    aimiliano about 8 years
    I am waiting Facebook approval for the feed to go live. when it goes live i will test it again to see which version works. right now the parser in Facebook doesn't give me a warning and i can see the feed but the analytics don't count.
  • aimiliano
    aimiliano about 8 years
    nope still not working we have gone live and still analytics is not counting. so everything i have tried in this question doesn't work..
  • neoplomero
    neoplomero about 8 years
    You haven't show your code. This code is live and working on 5 different sites.
  • Lucas Young
    Lucas Young almost 8 years
    I have this code and it appears in the post feed preview in WordPress using the Automattic plugin, but where do you find it in GA? Does something need to be set up there? <figure class="op-tracker"> <iframe><script> *** omitted for brevity *** ga('create', 'MY-UA-CODE', 'auto'); ga('require', 'displayfeatures'); ga('set', 'campaignSource', 'Facebook'); ga('set', 'campaignMedium', 'Social Instant Article'); ga('send', 'pageview', {title: 'POST TITLE'}); </script> </iframe> </figure>
  • Lucas Young
    Lucas Young almost 8 years
    Also, how is 'POST TITLE' replaced with the name of the post in the above example? I'm using the 'official' instant articles plugin which has a field for the external tracking script.
  • Alyas
    Alyas about 7 years
    FB provides a JS variable for page title var title = ia_document.title; source: developers.facebook.com/docs/instant-articles/analytics
  • Alyas
    Alyas about 7 years
    FB provides a JS variable for page title var title = ia_document.title; source: developers.facebook.com/docs/instant-articles/analytics
  • neoplomero
    neoplomero about 7 years
    Lucas Young you should be looking for campaignMedium filters on GA
  • jerclarke
    jerclarke about 7 years
    If ia_document.title; works then why hasn't anyone integrated it into their examples? Isn't it the only/obvious choice?
  • neoplomero
    neoplomero about 7 years
    Is no the only choice. Is one option. My example allows you to set what ever you want, that included.
  • Funana
    Funana about 7 years
    Thank you. I could not use this solution because I insert the tracking code via iFrame. The brilliant answer of @jeremyclarke was, what solved the issue for me. Thank you very much!
  • jerclarke
    jerclarke about 7 years
    But it misleads people into thinking it might actually work, why do that when you could MAKE it work by using the ia_document.title? Someone in the FB group for iA Open Source ended up with "POST TITLE" as the title of all his iA posts. There is no other logical solution than ia_document.title, please fix your answer.
  • jerclarke
    jerclarke about 7 years
    "Works perfect" is also a bad summary. It should say "Works after you find out the actual solution for post title and replace my dummy text with it. Sorry for being rude, but this is a frustrating problem in iA+GA and your solution is the top answer.
  • neoplomero
    neoplomero about 7 years
    Great, I'll update it. But you should read what you're implementing instead of copy paste.
  • jerclarke
    jerclarke over 5 years
    I use both a dimension and my answer above (source / medium). Dimension works well along with other info. In my case I have a dimension for page_type and use it for e.g. homepage, search, post (normal), post-ia and post-amp. This one dimension lets me easily dodge a lot of complexity within the GA interface.
  • jerclarke
    jerclarke over 5 years
    Ah I see. Interesting. Could you share a screenshot(s) of how this looks in GA? Does it go in the Facebook section of Social channels?
  • natterstefan
    natterstefan over 5 years
    Yes, of course. You can find screenshots here: gist.github.com/natterstefan/7e00e1dff512c703e6275a609a4b896‌​c.
  • jerclarke
    jerclarke over 5 years
    Alright, sorry if they were already there! That's fantastic, you've cracked the code!!! And because the domain is ia.facebook.com it's still clear at a source/medium level how to distinguish IA from other FB. Truly this seems to be the final answer. I'll test it on my personal setup, then update my answer here and on my other question. We need to get the word out to FB that this is what they should recommend to people.