Как добавить на сайт analytics.js

Библиотека JavaScript analytics.js позволяет отслеживать взаимодействия пользователей с вашим сайтом. Из этой статьи вы узнаете, как добавить analytics.js на сайт.

Код отслеживания JavaScript

Самый простой способ приступить к использованию analytics.js – это добавить в шаблоны сайта приведенный ниже код отслеживания JavaScript.

Вставьте код перед закрывающим тегом </head>. Строку 'UA-XXXXX-Y' следует заменить на идентификатор ресурса Google Analytics, который нужно отслеживать (его также называют "идентификатором отслеживания").

<!-- Google Analytics -->
<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', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<!-- End Google Analytics -->

Код, приведенный выше, выполняет 4 основных задачи:

  1. Создает элемент <script>, который инициирует асинхронную загрузку библиотеки analytics.js со страницы https://www.google-analytics.com/analytics.js
  2. Инициирует глобальную функцию ga (называемую очередью команд ga()), которая позволяет запланировать выполнение команд после полной загрузки и готовности библиотеки analytics.js.
  3. Добавляет в очередь команд ga() команду создания нового счетчика для ресурса, указанного в параметре 'UA-XXXXX-Y'.
  4. Добавляет в очередь команд ga() команду отправить в Google Analytics обращение типа pageview для текущей страницы.

Если вы хотите получать информацию о дополнительных взаимодействиях, используя собственную реализацию, вам может потребоваться изменить последние две строки фрагмента отслеживания JavaScript (команды create и send) или добавить код. Не следует модифицировать код, загружающий библиотеку analytics.js или инициирующий функцию очереди команд ga().

Альтернативный асинхронный код отслеживания

Выше показан стандартный фрагмент кода analytics.js, который загружается и выполняется асинхронно на всех браузерах. Тем не менее, современные браузеры не поддерживают предварительную загрузку такого скрипта.

Показанный ниже альтернативный код избавлен от этого недостатка и позволяет повысить производительность в современных браузерах. Обратите внимание, что в Internet Explorer 9 и старых мобильных браузерах, которые не распознают атрибут async, этот скрипт может загружаться синхронно. Поэтому учитывайте особенности вашей аудитории.

<!-- Google Analytics -->
<script>
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-XXXXX-Y', 'auto');
ga('send', 'pageview');
</script>
<script async src='https://www.google-analytics.com/analytics.js'></script>
<!-- End Google Analytics -->

Какие данные получает код отслеживания?

После того как вы добавите на сайт любой из приведенных вариантов кода отслеживания, в Google Analytics будет отправляться обращение категории pageview при каждом посещении ваших страниц. Благодаря этому вы сможете получать самую разную информацию, в том числе:

  • общее время нахождения пользователя на вашем сайте;
  • время пребывания пользователя на каждой из страниц и порядок их посещения;
  • сведения о ссылках, нажатых пользователем (в соответствии с URL следующего обращения типа pageview).

Кроме того, благодаря анализу первоначальной страницы, IP-адреса и агента пользователя, выполняемому библиотекой analytics.js при создании нового счетчика, могут быть также определены следующие параметры:

  • географическое положение посетителя;
  • используемый им браузер и операционная система;
  • размер экрана и наличие Flash или Java;
  • сайт-источник перехода.

Дополнительная информация

Для создания базовых отчетов достаточно стандартного кода отслеживания JavaScript, однако во многих случаях вам могут понадобиться дополнительные сведения о пользователях.

Руководства, размещенные на этом сайте, помогут вам отслеживать интересующие вас взаимодействия с помощью analytics.js. Прежде чем реализовать те или иные функции, ознакомьтесь со статьями, приведенными в разделе Основы в навигационной панели слева. Из них вы получите общее представление о библиотеке anallytics.js и сможете лучше ориентироваться в примерах кода в различных статьях.

Следующий раздел посвящен принципам работы analytics.js.