Installing and configuring the tag for SPA sites

Tag initialization

To use a Yandex Metrica tag on SPA sites, follow these steps:

1. Create and install the code snippet on your site, if it is not yet installed.
2. When initializing the tag, set the defer parameter to true. This is required to disable the automatic submission of data on views. To register page impressions, use the hit function, as described in point 3.

   Example of initializing the tag:

   ym(XXXXXX, 'init', {
       defer: true,
       clickmap:true,
       trackLinks:true,
       accurateTrackBounce:true
   })

3. In order for Yandex Metrica to register important changes to a page, analyze the logic of your site and insert a hit function in the appropriate places so it’s triggered each time you believe the page has changed.

   Call the hit function:

   ym(XXXXXX, 'hit', url[, options]);

   Parameters that can be passed in the hit function:

   Parameter	Default value	Type	Description
   url *	—	string	Current page URL
   options	—	Object	—
   options fields
   options.callback	—	Function	The callback function to call after sending pageview data
   options.ctx	—	Object	Context accessed by the this keyword in the callback function
   options.params	—	Object	Session parameters
   options.referer	—	string	The URL that the user loaded the current page contents from
   options.title	document.title	string	Title of the current page
   options.params fields:
   order_price	—	Double	Revenue by goal. You can set the cost in currency or Yandex units.
   currency	—	string	Use this field if you want to pass the goal cost in currency. Yandex Metrica recognizes three-letter ISO 4217 currency codes If a different currency is passed, null values will be sent instead of currencies and amounts.

   Parameter	Default value	Type	Description
   url *	—	string	Current page URL
   options	—	Object	—
   options fields
   options.callback	—	Function	The callback function to call after sending pageview data
   options.ctx	—	Object	Context accessed by the this keyword in the callback function
   options.params	—	Object	Session parameters
   options.referer	—	string	The URL that the user loaded the current page contents from
   options.title	document.title	string	Title of the current page
   options.params fields:
   order_price	—	Double	Revenue by goal. You can set the cost in currency or Yandex units.
   currency	—	string	Use this field if you want to pass the goal cost in currency. Yandex Metrica recognizes three-letter ISO 4217 currency codes If a different currency is passed, null values will be sent instead of currencies and amounts.

   Example of calling the hit function

   ym(XXXXXX, 'init', {});
   //...
   ym(XXXXXX, 'hit', '#contacts', {
       title: 'Contact information',
       referer: 'http://example.com/#main'
   });

Sending conversions

ym(XXXXXX, 'reachGoal', 'TARGET_NAME);

Examples of setting goals in the code snippet.

Transmitting session parameters and user parameters

ym(XXXXXX, 'params', {param1: 'param_value1'})

ym(XXXXXX, 'userParams', {param1: 'param_value1'})

Transmitting e-commerce data

To transmit data, enable e-commerce in Yandex Metrica.

Enabling Session Replay, click maps, link maps, and Form Analysis

You can connect Session Replay 2.0, click maps and link maps. The scroll map, form analysis, and Session Replay 1.0 are not supported.