Installing and configuring a tag in Facebook Instant Articles

The Yandex Metrica tag can be installed in a Facebook Instant Article.

Due to the way Instant Articles are implemented, the JavaScript code snippet is isolated from other HTML elements. This means that the following features of Yandex Metrica are available:

  • Session Replay
  • Click map, link map, and scroll map
  • Form analysis
  • E-Commerce data

You can use special HTML elements to add the Yandex Metrica code snippet to an instant article.

  1. Installing a tag
  2. Transmitting session parameters
  3. Transmitting user parameters
  4. Example of tag integration

Installing a tag

Attention. Content analytics data cannot be collected from Facebook Instant Articles.

Add the following code to the body element in the instant article:

...
<figure class="op-tracker">
  <iframe>
    <!-- Tag code -->
  </iframe>
</figure>
...

The tag registers sessions for the page that is specified in the head element as canonical:

...
<head>
  <meta charset="utf-8">
  <link rel="canonical" href="http://example.com/page.html">
  <meta property="op:markup_version" content="v1.0">
</head>
...

To check that the tag is working correctly, use the endpoint from Facebook.

Transmitting session parameters

  1. Create the yaParams JavaScript object:
    ...
    var yaParams = {
      title: "Article title",
      referrer: "Article referrer"
    }
    ...
  2. Send parameters for tag initialization:

    ...
    ym(XXXXXX, 'init', {params: window.yaParams||{}});
    ...

    Facebook provides a specific set of data about instant articles that can be used as session parameters. You can get this data from the ia_document JavaScript object.

Transmitting user parameters

  1. Send pageview data using the hit method after tag initialization:
    ...
    ym(XXXXXX, 'init', {
      defer: true
    });
    ym(XXXXXX, 'hit', ia_document.shareURL, {
      referer: ia_document.referrer,
      title: ia_document.title
    });
    ...
  2. Send user parameters by invoking the UserParams function:
    ...
    ym(XXXXXX, 'userParams', { user_key: "user_value"});
    ...

Example of tag integration

<body>
  ...
  <figure class="op-tracker">
    <iframe>
      <script type="text/javascript"><script>
        (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
        m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
        (window, document, 'script', 'https://mc.yandex.ru/metrika/tag.js?id=XXXXXX', 'ym')

            ym(XXXXXX, 'init', { 
                trackLinks:true,
                accurateTrackBounce:true,
                params: window.yaParams||{title: "no title"}
            });

      </script>
      <noscript><div><img src="https://mc.yandex.ru/watch/XXXXXX" style="position:absolute; left:-9999px;" alt=""/></div></noscript>
    </iframe>
  </figure>
  ...
</body>

XXXXXX is your tag ID.

If you were unable to independently check the tag, follow the recommendations below.

This might happen for the following reasons:

  • The tag is installed incorrectly. For example, the CMS modified the code snippet. Reinstall the tag or contact the support service for your CMS.
  • Broken scripts are preventing the Yandex Metrica tag from working on the site. You can check this in the browser console.

This means that information is being transmitted to Yandex Metrica. However, the data might not be shown in reports for any of the following reasons:

  • Data is sent to a tag with a different number.
  • The Filters tab in the tag settings has overly strict filters defined. Remove unneeded filters.
  • The Filters tab in the tag settings has the Don't count my sessions filter enabled. This means that the tag doesn't register your own sessions. Try accessing the site with your browser in “incognito” mode.