Подключение Яндекс.Метрики в Html5. Получение API ключа Яндекса

Имя счетчика Указанное имя отображается на странице Мои счетчики и в верхнем меню переключения между счетчиками. Если не задано, используется значение поля Адрес сайта . Адрес сайта

Основной домен сайта. Поле обязательно для заполнения. Префикс схемы/протокола (http:// , https://) указывать не следует .

Подробно о структуре URL

http:////?

  • - домен сайта;
  • Путь, который может иметь иерархическую структуру. Структура задается с помощью символа «/» ;
  • Имя страницы сайта;
  • Блок параметров, который отделяется от блока Символом «?» .

Дополнительные адреса сайтов

Указание дополнительного адреса сайта может понадобиться в следующих случаях:

  • по разным адресам отвечает один и тот же сайт с одним и тем же установленным счетчиком;
  • вы хотите получать статистику по нескольким сайтам с помощью одного счетчика;
  • вы хотите получать уведомления о проверках доступности сайта .

Переходы между всеми заданными адресами считаются внутренними.

В этом поле вы можете указать путь сайта (path в структуре URL). Например, example.com/category/ . При этом не указывайте адрес до определенного файла или фрагмента страницы (символа «#» ) - эти указания вызовут ошибку в поле для ввода. Кроме того, не будут учитываться переданные в URL параметры запроса (часть адреса после символа «?» ).

Если вы видите в отчетах данные о посещении страниц, не принадлежащих вашим адресам сайтов, и эти данные вам не нужны, включите опцию Принимать данные только с указанных адресов сайтов .

Чаще всего такая ситуация возникает в следующих случаях:

  • Кто-то (скорее всего по ошибке) инициализировал счетчик с вашим номером на своем сайте.
  • Страницы ваших сайтов просматривались через прокси-сервис.
  • Существует практически точная копия содержимого ваших страниц на других доменах. При копировании контента был скопирован и код счетчика.

Опция Включая поддомены позволяет учитывать при фильтрации поддомены основного и дополнительных сайтов (subdomain.example.com , other.subdomain.example.com , ...).

Вебвизор, карта скроллинга, аналитика форм Эта опция также подключает карту кликов и карту ссылок .

Также вы можете:

Включить опцию «Не сохранять полные IP-адреса посетителей сайта»

Обычно в Яндекс.Метрике сохраняется полный обезличенный IP-адрес посетителя . При включенной опции в системе запишется неполный адрес. Например, значение 192.0.2.2 изменится на 192.0.2.0 . Это снижает точность определения региона посетителя сайта.

Чтобы включить опцию, откройте блок .

Подтвердить согласие с Договором об обработке данных в Яндекс.Метрике

Это необходимо, если ваша компания зарегистрирована в ЕС или Швейцарии - или вы обязаны соответствовать Генеральному регламенту о защите данных (General Data Protection Regulation, сокращенно GDPR) по другим причинам.

Чтобы принять договор, откройте блок Дополнительные условия обработки данных .

Дополнительные настройки счетчика

Отслеживание хеша в адресной строке Опция применяется для AJAX-сайтов и позволяет корректно подсчитывать количество просмотров на страницах, которые обновляются без перезагрузки. Для XML-сайтов Элемент noscript не должен использоваться в XML-документах. Альтернативный CDN Опция позволяет корректно учитывать посещения из регионов, в которых ограничен доступ к Яндекс.Метрике. Использование этой опции может снизить скорость загрузки кода счетчика. Даже при включенной опции код счетчика может отправлять предварительный запрос к mc.сайт для экономии трафика. Устаревший код счетчика

Использование старого кода счетчика, поддерживающего Вебвизор 1.0.

По умолчанию Яндекс.Метрика использует новый код счетчика и Вебвизор 2.0 . Используйте устаревший код, только если вам необходим Вебвизор 1.0.

Асинхронный код

Код счетчика не блокирует и не влияет на скорость загрузки страницы вашего сайта. Отображается, если включена опция Устаревший код счетчика .

Отправка в Метрику данных электронной коммерции Опция позволяет подключить Ecommerce через интерфейс. Если опция включена, по умолчанию JavaScript-массиву присваивается имя dataLayer . Вы можете изменить его в поле Имя контейнера данных . Тайм-аут визита в минутах

Это время бездействия посетителя на сайте. По истечении указанного количества минут визит будет считаться завершенным. Тайм-аут визита задается целым числом от 30 до 360. По умолчанию составляет 30 минут.

Итак, мы будем говорить о том, как скрыть счетчик Яндекс Метрики, чтобы он вообще не отображался на сайте, но продолжал регулярно и точно собирать статистические сведения. Если быть точным до конца — в данной статье на сайт речь пойдет не о счетчике, а о конкретном наглядном визуальном информере!

Т.е. задача сводится к тому, чтобы скрыть информер Яндекс Метрики, а не счетчик целиком! И сразу же приступаем к решению проблемы.

ВАЖНО: сейчас Яндекс обновил и дизайн и функционал, но суть осталась прежней, и эта пошаговая инструкция все еще актуальна!

Первый способ скрыть счетчик Яндекс Метрики

1. Если вы только создаете новый счетчик, то в разделе создания кода («Код счётчика») нужно всего лишь снять галочку против поля «Информер», деактивизировав (отключив) данную функцию.

О том, как добавить счетчик Метрики на страницы ресурса, мы говорили в одной из предыдущих тем — « » (кто забыл, может подсмотреть и вернуться обратно).

Примечание: здесь же можно подключить/отключить все прочие функции и инструменты в любое время, когда пожелаете.

Второй способ скрыть счетчик Яндекс Метрики

Второй способ подойдет для тех, у кого счетчик (информер) уже установлен на сайте. В этом случае можно пойти двумя путями:

— отредактировать код счетчика в настройках Метрики;

— удалить информер прямо из кода счетчика на сайте, ничего не меняя в Метрике (в этом случае не исключены ошибки в системе Яндекс.Метрика, хотя результат будет достигнут).

1. Редактирование счетчика Яндекс Метрики

1.1 Идем в Яндекс.Метрику к списку своих сайтов и выбираем «Редактировать» (справа от названия сайта в списке, перед кнопкой удаления счетчика):

1.2. Снимаем галочку против инструмента «Информер»

1.3. Копируем обновленный код и меняем его на сайте.

2. Удаление счетчика Яндекс Метрики

В ручном режиме без редактирования сервисных служб; здесь всё просто. Информер Метрики в коде счетчика занимает отдельную обособленную позицию, которая имеет границы:


//код информера
//код информера
//код информера
//код информера

Так вот, если удалить целиком эту запись с нашего сайта (прямиком из кода), то информер исчезнет сам по себе даже без настройки этой функции в сервисе Яндекс.Метрики. Говоря проще, вышеуказанный код на сайте нужно выделить и удалить, — это самый простой способ скрыть счетчик Яндекс Метрики.

КОД с информером:

КОД БЕЗ информера:

При этом сам счетчик Метрики будет работать без единой помехи, передавая статистическую информацию внутрь личного кабинета пользователя Яндекса, где мы всегда можем посмотреть любые данные. Но если информер будет удален, то никто посторонний не сможет заглянуть в нашу статистику без секретного Логина или Пароля.

Примечание: действуя в обратном порядке, мы может наоборот, добавить в счетчик Яндекс Метрики информер, который будет отображен на сайте.

Нужно ли «светить» свою статистику для читателей сайта — решать только вам..к. эту функцию прекрасно выполняет общепринятый счетчик Liveinternet, а загромождать сайт лишним кодом нет никакого смысла. И по старой традиции видео по работе с Яндекс Метрикой.

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

В итоге пришлось буквально на уровне чутья и опыта проделывать нехитрые манипуляции, используя такого зверя как API яндекса.
Что это такое рассказывать не буду, благо на это есть википедия, там все найдете. Итак, если у вас резко возник «головняк» с установкой виджета яндекс пробок на сайт то «Велкам» на эту статью.

Получение API ключа Яндекса

Первым делом нам нужно получить тот самый ключ яндекса, который отворит нам двери в свои сервисы, которые мы можем без проблем интегрировать на любой веб ресурс. Для этого нам нужно зайти во все сервисы и выбрать пункт API карты. Не пугайтесь, мы выбираем этот пункт,чтобы из него потом попасть на страницу получения «ключика»

Затем выбираем пункт «Получить API ключ»

Нам открывается форма куда мы должны вписать адрес сайта где будет находится наш информер карта с пробками от Яндекса. Я буду вносить адрес тестового сайта. Я на всякий случай делаю с префиксом http

На выходе мы получаем с вами длиннющий ключ, который потом в коде сайта и подставим

Там же внизу вы найдете подсказку как установить ключ Яндекс пробки в структуру кода

Значит ключ мы получили, теперь сохраните его в блокнотике, чтобы потом удобно было скопировать и вставить.

Следующим шагом мы переходим во вкладку «Песочница». Чтобы вы не запутались, предыдущий шаг мы делали во вкладке «О Технологии».

В песочнице сбоку слева нам нужно выбрать подпункт «Пробки»

В этом пункте, как в матрешке, выбираем раздел «Слой пробок на карте без добавления кнопки»

Вот теперь начинается самое интересное! Нам необходимо перейти в нашего блога, зайти в раздел «Внешний Вид->Редактор» и выбрать шаблон страницы header.php. Именно сюда мы будем подключать кусочек скрипта и связываться с api яндекса. Вот сам код, в нем вы меняете только ключ и раздел сервиса.

Значит еще раз повторюсь ключ вы вставляете после слова key а сам раздел, указывающий на то,что мы подключаем именно яндекс пробки следующий modules = traffic

Вставлять мы его будем между служебными тегами < head > < / head > как это показано здесь.

Думаю понятно разжевал:-)

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

Итак, следующий шаг наших действий Вам нужно скопировать еще один код ниже

YMaps.jQuery(function () { // создание карты var map = new YMaps.Map(YMaps.jQuery("#YMapsID")), // создание элемента управления "Пробки" traffic = new YMaps.Traffic.Control(); // инициализация карты map.setCenter(new YMaps.GeoPoint(20.501989,54.719919), 10); // добавление элемента управления "Пробки" на карту map.addControl(traffic); // включение показа пробок traffic.show(); });

YMaps . jQuery (function () {

// создание карты

var map = new YMaps . Map (YMaps . jQuery ("#YMapsID" ) [ 0 ] ) ,

// создание элемента управления "Пробки"

traffic = new YMaps . Traffic . Control () ;

// инициализация карты

map . setCenter (new YMaps . GeoPoint (20.501989 , 54.719919 ) , 10 ) ;

// добавление элемента управления "Пробки" на карту

map . addControl (traffic ) ;

// включение показа пробок

traffic . show () ;

} ) ;

и вставить его ниже кода с подключением API, вот как этом скриншоте

Подлючаем Яндекс пробки через код html

Давайте подытожим, что мы сделали. Мы подключили ключ, вставили два кусочка кода яваскрипта от api яндекса в шаблон header.php. Теперь мы должны определиться с тем местом, где наш информер яндекс пробки будет отображаться. Для этого я создам у себя отдельный виджет, который будет размещаться в сайдбаре.

Зайдем во вкладку виджеты и выберем произвольную текстовую область.

Назовем ее например «Пробки Города» и вставим вот этот код

Вы можете регулировать размеры карты через стили внутри контейнера div. В моем случае я задал размеры по длине width : 230px ;

И вот, что у нас в итоге получилось. Смотрите на скриншот

Карта получилась даже немного больше положенного размера и начала выходить за пределы сайдбара. Значит можно просто уменьшить длину самой карты.

Определение города в Яндекс Пробках

Если вы заметили, то у меня отображаются пробки именно в городе Калининграде, поскольку я задал соответствующие координаты в коде скрипта

Что же нужно сделать, чтобы определился ваш город? Для этого снова идем в наш сервис где мы получали ключ и там в нижнем меню есть пункт «Определение координат»

Отлично, а сейчас в специальном поле вводим нужный вам город, давайте остановимся на Архангельске, и нажмем найти

Все что нам остается это вписать полученные координаты в «тело» скрипта, как показано на этом скриншоте

Теперь мы в курсе дорожной обстановки по пробкам в Архангельске 🙂

На этом все! В ближайшее время будет готов авторский видеоурок, в котором вы сможете без проблем установить яндекс пробки к себе на сайт или блог. Всем удачи и отличного настроения!

Добавление счетчика на Яндексе

После регистрации нажмите на иконку "Добавить счетчик".

Затем введите название сайта, его адрес и другие данные.

Номер счетчика можно найти на вкладке "Основное". Скопируйте его, он нам понадобится в дальнейшем.

Установка виджета в редакторе

Итак, у нас есть номер счетчика. Вернемся в редактор. Теперь нам надо установить виджет счетчика Яндекс.Метрики. Он находится в левом меню.

Установите этот виджет на мастер-странице (шаблоне).

Примечание. Если Информер выключен, иконка виджета не будет отображаться при просмотре сайта.

Нажмите дважды левой кнопкой мышки на иконку с виджетом, чтобы открыть окно с настройками.

В поле ID счетчика вставьте ранее скопированное из Яндекса значение.

Примечание. У вас будет другой номер счетчика. Это нормально.

Функция Webvisor является внутренней опцией Яндекс.Метрики, которая позволяет отслеживать и даже просматривать в режиме видео поведения посетителей вашего сайта. Если вам не требуется данная функция, мы рекомендуем ее не включать, так как, иногда она может привести с снижению скорости загрузки сайта.

Информер

Информер представляет из себя визуальный счетчик, который будет виден при просмотре сайта.

В настройках виджета редактора включите галочку с информером.

По умолчанию, вставится код информера без дополнительных настроек.

Задать дополнительные настройки Информера можно в личном кабинете Яндекс.Метрики:


Изменить его внешний вид вы можете по данной ссылке:

Откроется вот такая админка. Все изменения будут сразу отображаться в области предпросмотра.

Если вы меняете настройки от стандартных, необходимо заменить код информера на сайте. Скопируйте его на Яндексе

Вернитесь в редактор и встаьте новый код в поле кода информера.


Все! Опубликуйте свой сайт и изменения вступят в силу.

Обратите внимание, что корректные данные начнут отображаться по прошествии 24 часов с момента установки виджета с Яндекс.Метрикой.
Заходить проверять статистику вы можете сразу на Яндексе по ссылке