Installing and configuring a tag in Facebook Instant Articles

You can install your Yandex Metrica tag in Facebook Instant Articles*.

Due to the way Instant Articles are implemented, the JavaScript tag code 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.

Installing a tag

Alert

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

Create the yaParams JavaScript object:

...
var yaParams = {
  title: "Article title",
  referrer: "Article referrer"
}
...

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

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
});
...

Send user parameters by calling 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 — Your tag number.

Chat with us

Write an email

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

Data is not sent to the console

This might happen for the following reasons:

The tag is installed incorrectly. For example, the CMS modified the tag code. 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.

The recommendations did not help

There is data in the console, but the reports do not appear

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.

The recommendations did not help

Useful links

Online training

Was the article helpful?

Installing multiple tags on a site

Installing a tag on WebView (Android)