Установка Яндекс Метрики на сайт
Установка Яндекс Метрики на сайт
В прошлой статье мы создали счетчик Яндекс. Метрики своими руками, сделали все необходимые настройки, для правильного отображения и сбора статистики.
Теперь для того, чтобы собирать статистику нам нужно скопировать код Яндекс Метрики и поставить на все страницы сайта. Код устанавливается пределах тегов <head> </head> или <body> </body> как можно ближе к началу страницы сайта.
Код Метрики можно ставить на сайт несколькими способами в зависимости от того работает сайт без движка, либо имеет какую-либо CMS.
Способы установки кода Яндекс Метрики на сайт:
- Установка в код сайта (в основном ставится на сайты работающие без CSM: одностраничные сайты, лендинги x1x.live и т.п.)
- Установка с помощью плагина в CMS сайта (для сайтов работающих на популярных CMS: Word Press, Bitrix, MoDX, Joomla, OpenCart)
- Установка в произвольный HTML-блок (есть нет готовых плагинов).
- Установка в шаблон дизайна сайта в админке
Выше перечислены самые частые способы установки кода Метрики на сайт. Как устанавливать по сути без разницы, zzztube главное чтобы код отображался на всех страницах вашего сайта.
В основном логика установки такая:
- Если сайт работает без CMS — устанавливаем в код сайта
- Если есть CMS — устанавливаем с помощью плагина
- Если CMS есть, но плагина нет — устанавливаем другими способами
В данной статье я приведу подробную инструкцию как устанавливать код Метрики на сайт, чтобы все работало правильно и верно отображалось.
На что обратить внимание
- Если на сайте используется несколько CMS, например одна для сайта, вторая для блога, то код Метрики нужно ставить на все CMS, чтобы код отображался на всех страницах сайта.
- Код Яндекс Метрики нужно ставить на абсолютно все страницы сайта. Если на какой-либо странице сайта кода не будет, что Метрика не увидите захода на эту страницу.
- Если после установки кода вы изменили настройки Яндекс Метрики, то нужно обновить код на сайте, чтобы все изменения вступили в силу.
Google Tag Manager
Диспетчер тегов Google (Google Tag Manager) – это очень полезный инструмент, с помощью которого можно быстро добавлять или удалять различные фрагменты кода на сайте или в мобильном приложении. Нужно всего лишь раз добавить на сайт код Google Tag Manager и потом можно без вмешательства программистов добавлять нужные счетчики и другой код. Устанавливается этот инструмент просто:
Установка Google Tag Manager
Сначала создайте аккаунт. Это можно сделать по ссылке: https://www.google.com/intl/ru/tagmanager/
Во время регистрации вам нужно будет прописать название самого аккаунта и название контейнера (это JavaScript код, который вставляется на все страницы сайта).
После прочтения и подтверждения лицензионного соглашения вам будет доступен код Google Tag Manager:
Полученный код необходимо разместить после открывающего тега <body> на всех страницах сайта.
Получение кода счетчика
- Регистрируетесь на Яндексе
Так получаете не только почтовый ящик, но и возможность пользоваться многочисленными сервисами Яндекса. Ну и среди прочего – учтановить на свой сайт счетчик посещаемости от самого Яндекса:)
Код счетчика получен. Теперь необходимо разместить его на Вашем сайте.
Установка счетчика Google Analytics
После создания счетчика у вас откроется окно “Сведения о веб-потоке”. В этом окне вам нужно проверить, активирована ли улучшенная статистика (если нет – активируем). После этого переходим к инструкции по добавлению тегов.
Установить счетчик можно 2-мя способами:
- Напрямую вставить код на сайт;
- С помощью Google Tag Manager.
Рассмотрим оба способа.
Установка счетчика Google Аналитики напрямую
Для установки кода напрямую вам необходимо выполнить несколько простых шагов:
- Скопировать код счетчика.
- Зайти в код сайта через админку или FTP.
- Вставить код счетчика в тег <head>.
Если у вас возникли сложности, начиная со второго пункта, то передайте эту работу вашему вебмастеру/программисту (человеку, который занимается сайтом). Размещение кода займет не более 5 минут.
Установка счетчика Google Аналитики через GTM
Для использования этого способа у вас на сайте уже должен быть установлен Google Tag Manager.
Вкратце расскажу, как установить GTM на сайт. Переходим в Менеджер тегов Google, и кликаем на кнопку “Создать аккаунт”. Если у вас уже есть аккаунт, пропустите этот шаг.
Далее необходимо указать название аккаунта (можете назвать как захотите), выбрать страну. В модуле “Создание контейнера” указываем название сайта (URL), и выбираем целевую платформу “Веб-сайт”, кликаем на “Создать”.
Теперь необходимо скопировать 2 фрагмента кода и разместить их на вашем сайте согласно инструкции. Первый код размещаем в теге <head>, а второй в теге <body>.
На этом установка GTM на сайт завершена. Переходим к установке счетчиков аналитики.
Для установки счетчика переходим в наш аккаунт GTM.
Открываем вкладку “Теги” в левом меню.
Кликаем на кнопку “Создать”.
Сейчас мы создадим тег (выполняемое действие) и триггер (условие, при котором действие будет выполнено).
В качестве тега будет активация кода счетчика, другими словами запуск счетчика в работу, а в качестве триггера открытие любой страницы, чтобы счетчик работал на всех страницах.
Сперва укажем название тега, чтобы понимать за то он отвечает. Далее кликаем на область окна “Конфигурация тега”.
Тут мы выбираем тип тега “Google Аналитика: конфигурация GA4”.
В открывшемся окне необходимо ввести идентификатор потока данных.
У многих новичков возникнет вопрос: что это и где его взять? Рассказываю.
Идентификатор потока данных – это элемент кода отслеживания, по которому Google Analytics определяет, где установлен счетчик, а также собирает данные.
Узнать ваш идентификатор можно в настройках Google Аналитики. Для этого перейдите на сайт Google Аналитики, в левой колонке кликните на “Администратор”, во второй колонке (“Ресурс”) кликните на “Потоки данных”, далее выберите ваш сайт, и в правом верхнем углу вы увидите идентификатор, который нужно скопировать и вставить в GTM.
После установки идентификатора кликаем на область “Триггеры”.
Тут выбираем стандартный триггер “All Pages”, чтобы счетчик работал на всех страницах.
И нажимаем “Сохранить”.
Для активации тега на сайте необходимо отправить изменения на сайт. Для этого кликаем на кнопку “Отправить” в правом верхнем углу.
На этом установка счетчика Google Аналитики 4 через GTM завершена! Установка счетчика UA выполняется по такому же принципу.
Источник данных: счетчик Top.Mail.Ru
Вы можете показывать рекламу только тем пользователям, которые заходили к вам на сайт. Например, выделить аудиторию, которая добавляла товары в корзину, но не совершала покупку, и показывать рекламу этим людям.
Чтобы использовать Top.Mail.Ru как источник данных для рекламных кампаний:
- Подключите счетчик Top.Mail.Ru. Если используете счетчик Top.Mail.Ru для динамического ретаргетинга, пропишите в коде события.
- Настройте цели для счетчика
- Добавьте источник к сегменту
Подключение существующего счетчика Top.Mail.Ru
Если у вас уже есть счетчик Top.Mail.Ru,
- перейдите на вкладку «Аудитории» → «Счетчики Top@Mail.Ru»;
- введите емейл владельца счетчика в поле «Владелец счетчика» и номер счетчика в поле «ID счетчика»;
- нажмите «Отправить запрос на добавление».
Запрос на добавление счетчика можно отправлять только из аккаунта рекламодателя.
На почту, которая привязана к счетчику, придёт письмо с валидационной ссылкой. Перейдите по ссылке из письма, и счетчик будет привязан к аккаунту в myTarget.
Создание нового счетчика Top.Mail.Ru
Создайте счетчик Top.Mail.Ru. Откройте вкладку «Аудитории» → «Счетчики Top@Mail.Ru» и нажмите «Создать счетчик».
Укажите данные для создания счетчика:
- Название счетчика — оно будет отображаться в интерфейсе Top.Mail.ru и myTarget;
- Адрес ресурса — адрес сайта, куда будет установлен счетчик, с указанием протокола;
- Ваш e-mail — на этот электронный адрес придет ссылка для подтверждения;
- Пароль — нужен для доступа к счетчику в Top.Mail.Ru и должен содержать больше 6 символов.
Включите опцию «Использовать код для синхронизации данных», чтобы счетчик собирал информацию о посетителях вашего сайта. Эти данные можно будет использовать в качестве источника данных.
На указанную почту придет письмо с подтверждением добавления счетчика к вашему аккаунту. Перейдите по ссылке в письме, чтобы завершить добавление счетчика.
Все счетчики отображаются на вкладке «Аудитории» → «Счетчики Top@Mail.Ru». Чтобы скопировать код счетчика, нажмите ссылку «Код» рядом с названием счетчика.
После того как счетчик накопит статистику (статус счетчика — «Работает»), его можно использовать в качестве источника данных. Если данные на счетчик не поступают, проверьте, что счетчик установлен на сайте правильно, или обратитесь к владельцу счетчика.
- id — идентификатор счетчика в myTarget.
- Название счетчика — имя счетчика, которые вы задали. Слева от названия указан id счетчика в top.mail.ru. Справа — ссылка на код. Нажмите на неё, чтобы открыть и скопировать сгенерированный код счетчика.
- Цели — количество целей, которые настроены для этого счетчика. Нажмите «Добавить», чтобы редактировать цели.
- Look-alike — ссылка для создания Look-alike аудитории на основе данных вашего счетчика. Подробнее
- Статус — статус работы счетчика. Статус «Работает» означает, что счетчик активен, поступают данные. Если статус «Данные не поступают», проверьте, что счетчик установлен на сайте правильно, или обратитесь к владельцу счетчика.
- Охват — охват счетчика за календарную неделю. О статусах охвата читайте ниже. Нажмите на значок рядом с охватом, чтобы запросить и посмотреть портрет аудитории источника. Подробнее о портретах
- Сегменты — количество сегментов, в которых используется счетчик.
- Владелец — «свой» для счетчиков, которые добавили вы, «сторонний владелец» — счетчики, которыми сторонние владельцы поделились с вами.
В таблице на странице «Счётчики Top@Mail.Ru» отображается охват — количество пользователей, охваченных счетчиком за полную календарную неделю.
В поле «Охват» могут быть значения:
- число — количество пользователей, охваченных счетчиком за полную календарную неделю;
- число желтого цвета означает, что это не финальные данные — ещё идет подсчет охвата;
- идёт подсчет — в данный момент идёт подсчет размера сегмента. Это может занять некоторое время;
- менее 1000 — счетчики, в которых за прошлую неделю найдено от 0 до 1000 пользователей. Проверьте, что счетчик установлен на сайте правильно, или обратитесь к владельцу счетчика.
Если вы собираетесь использовать счетчик для динамического ремаркетинга, пропишите в коде события, данные о которых нужно передавать в myTarget.
Если код счетчика уже установлен, то добавьте к нему специальный код для динамического ремаркетинга:
Добавьте в код обязательные события (основной источник данных):
- product – посещение страницы продукта;
- cart – добавление продуктов в корзину или посещение страницы корзины;
- purchase – посещение страницы подтверждения покупки (факт совершения покупки).
Обязательно размещать код счетчика (обрамлен тегом <!— Rating@Mail.ru counter —> ) перед кодом динамического ремаркетинга (обрамлен тегом <!— Rating@Mail.ru counter dynamic remarketing appendix —>).
Пример размещения кодов счетчика и динамического ремаркетинга:
В коде счетчика вместо «ID счетчика» должен быть указан идентификатор счетчика, который вы выбрали при загрузке фида.
В коде динамического ремаркетинга вместо «VALUE» для параметров «productid«, «pagetype«, «list» и «totalvalue» должны быть заданы определённые значения. Они могут задаваться автоматически, например, с помощью некоего инструмента, формирующего код страниц вашего сайта.
Описание параметров динамического ремаркетинга
Используется для указания идентификатора продукта (продуктов), которых касается событие. Например, идентификатор продукта, которому посвящена отображаемая пользователю страница сайта.
Значение параметра обязательно должно соответствовать идентификатору продукта из фида (элемент «offer«, свойство «id«). Именно по этому идентификатору система понимает, какими продуктами интересовался пользователь, чтобы на их основе выбирать продукты из фида для отображения в рекламных объявлениях.
Пример: productid: ‘123456’
Если на странице представлено несколько товаров, например, на странице корзины (pagetype: ‘cart’) или странице подтверждения покупки (pagetype: ‘purchase’), то их идентификаторы нужно перечислить в массиве (в квадратный скобках через запятую).
Как установить счетчик Google Analytics на сайт
Установив диспетчер тегов, можно теперь с его помощью установить счетчик. Чтобы это сделать, нужно его для начала получить.
Как получить код счетчика Google Analytics
Чтобы получит код счетчика переходим в Гугл Аналитику и регистрируемся. Затем начинаем создание аккаунта, указывая название, выбирая «веб-сайт» и переходя к следующим настройкам:
Указав требуемую информацию, жмем «Создать», подтверждаем ознакомление с правилами и указываем, какие сообщения о событиях хотели бы получать. Закончив с этим, можно переходить непосредственно к установке кода Google аналитики.
Как установить код Google Analytics через Google Tag Manager
Закончив вышеописанные действия, пользователь получит код, который выглядит так:
Теперь его следует установить на сайт, поместив в шапку между двумя тегами <head></head>.
Ну а поскольку у нас уже есть Google Tag Manager, то не будем непосредственно вставлять счетчик в код сайта, а воспользуемся возможностями Диспетчера тегов. Для этого заходим в Tag Manager, выбираем «Контейнер» и жмем на кнопку «Добавить новый тег»:
Придумываем понятное название для тега и в перечне «Выбор продукта» жмем на Google Analytics:
Затем выбираем тип тега, указывая Universal Analytics, т. к. он предлагает больше разных функций по сравнению с классическим:
Затем вводим идентификатор счетчика с форматом UA-xxxxxxx-x:
Этот идентификатор берут с главной страницы Google Analytics:
Указав идентификатор, переходим к следующему пункту «Условия активации», где выбираем «Все страницы» и нажимаем «Создать тег».
Закончив создание тега, содержащего код счетчика Гугл Аналитики, публикуем его. Для этого в правой верхней части выбираем «Опубликовать», и в появившемся окошке жмем «Опубликовать сейчас».
На этом установка счетчика окончена, а информация о посещаемости сайта от него станет поступать в сервис Google Analytics в течение следующих 24 часов.
SEO-шников много, профессионалов — единицы. Научитесь технической и поведенческой оптимизации, создавайте семантические ядра и продвигайте проекты в ТОП!
Получить скидку →
Как установить и настроить пиксель Facebook?
Если вы настроили свой пиксель с помощью тегов IMG или планируете это сделать, мы рекомендуем следовать инструкциям, изложенным в документации для разработчиков. Подробнее.
В этой статье описано, как настроить пиксель Facebook и установить его на сайт. Узнать больше о пикселе Facebook и его преимуществах можно здесь.
Если вы уже создали пиксель и хотите найти его базовый код, перейдите к разделу Добавление пикселя Facebook на сайт и выполните инструкции по добавлению кода вручную.
Прежде чем начать
Как установить и настроить пиксель Facebook?
- Откройте Events Manager.
- Нажмите Подключить источники данных
и выберите Интернет.
- Выберите Пиксель Facebook, а затем — Подключить.
- Введите название пикселя.
- Введите URL сайта, чтобы узнать, возможна ли быстрая настройка.
- Нажмите Продолжить.
Как установить пиксель Facebook на свой сайт?
Создав пиксель Facebook, вы можете разместить его код на своем сайте. Инструкции для разных способов настройки отличаются.
- Откройте Events Manager.
- Выберите нужный пиксель.
- Нажмите Продолжить настройку пикселя.
- Выберите Пиксель Facebook, а затем — Подключить.
- Выберите Установить код вручную.
- Скопируйте базовый код пикселя.
- Найдите заголовок сайта либо шаблон заголовка в CMS или на веб-платформе.
- Вставьте код в конец раздела заголовка, прямо перед закрывающим тегом head.
- Нажмите Продолжить.
- Включите автоматический расширенный поиск совпадений и проверьте информацию о клиентах, которую хотите отправить (необязательно).
- Нажмите Продолжить.
- Добавьте события вручную или с помощью инструмента настройки событий.
Подробнее о том, как настроить события пикселя, используя код, см. на сайте Facebook for Developers.
- Откройте Events Manager.
- Выберите нужный пиксель.
- Нажмите Продолжить настройку пикселя.
- Нажмите Использовать партнера.
- Выберите партнера из списка.
- Следуйте инструкциям на экране.
Вы также можете настроить пиксель Facebook, перейдя на страницу с партнерскими интеграциями в Events Manager. Выберите партнера и следуйте инструкциям на экране. Подробнее о преимуществах партнерских интеграций для настройки пикселя.
Если вы не видите свою платформу, воспользуйтесь одними из двух других способов настройки пикселя.
Если код вашего сайта редактирует другой человек, выполните указанные ниже действия, чтобы отправить ему электронное письмо с инструкциями по установке пикселя Facebook.
- Откройте Events Manager.
- Выберите нужный пиксель.
- Нажмите Продолжить настройку пикселя.
- Нажмите Отправить инструкции по электронной почте.
- Введите электронный адрес получателя.
- Нажмите Отправить в нижней части страницы.
Настройка событий
Добавив базовый код пикселя на сайт, вы сможете настроить события и начать измерять ценные действия, например покупки. Вы можете установить код вручную или с помощью инструмента настройки событий. Когда всё будет готово, убедитесь, что пиксель работает исправно.
Один пиксель можно использовать для всего сайта, в том числе на нескольких страницах.
Если вы используете пиксель для отправки событий в Facebook, рекомендуем также настроить API Conversions. Этот API взаимодействует с пикселем и помогает таким образом повышать результативность и качество измерений ваших кампаний на Facebook. Подробнее об API Conversions.
Примечание. Apple требует, чтобы все приложения в App Store, которые выполняют "отслеживание" (по определению Apple), показывали пользователям iOS версии 14.5 и более поздних диалоговое окно с запросом разрешения на отслеживание через фреймворк AppTrackingTransparency. Это влияет на процессы получения и обработки событий, регистрируемых такими инструментами для бизнеса, как пиксель Facebook. Если вы выполняете оптимизацию, настраиваете таргетинг или составляете отчеты о веб-событиях с помощью пикселя Facebook или других инструментов Facebook для бизнеса, ознакомьтесь с инструкциями по настройке событий в приложении и подготовке к предстоящим обновлениям. Подробнее.