Инструкция по установке и настройке Диспетчера тегов Google Tag

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

А сколько раз бывало, что веб-мастера устанавливали код некорректно?

Но теперь можно об этом забыть! Google выпустил замечательный продукт под названием «Диспетчер тегов (Tag Manager) Google». Данный инструмент позволяет установить на сайт всего один код и больше никогда, ну, практически никогда, не просить веб-мастера о чем бы то ни было.

Суть в том, что Google Tag Manager – это панель, которая посредством всего одного скрипта, который устанавливается на сайт, позволяет подгружать любое количество скриптов, которыми можно управлять при помощи web-интерфейса.

Давайте для начала познакомимся с интерфейсом и научимся устанавливать расширенный код Google Analytics через данный инструмент.

Для начала потребуется перейти на страницу с сервисом, пройдя по упомянутой ссылке – http://www.google.com/tagmanager/

На экране можно увидеть следующее:

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

В следующем окне вам предложат назвать аккаунт:

Затем придумать имя контейнера, и выбрать часовой пояс. Помните, что часовой пояс в Tag Manager должен соответствовать часовому поясу в Google Analytics и на вашем сайте. Также необходимо задать URL сайта.

После того, как мы нажмем «Далее», нам предложат прочесть пользовательское соглашение.

После нажатия на кнопку «Я принимаю» мы наконец-то видим заветный код Google Tag Manager. Пожалуйста, сразу сохраните его в отдельный файл. Все дело в том, что незнакомому с интерфейсом пользователю будет довольно трудно его впоследствии найти.

На следующем экране нам предложат добавить заветный тег – контейнер, который будет хранить сторонние коды. Игнорируем данное окно и жмем «Я добавлю тег позже». После чего и попадаем на страничку с нашим контейнером, на которой нам необходимо нажать на кнопку «Новый тег».

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

В открывшееся поле необходимо внедрить наш код. На рисунке я вставлял расширенный код Google Analytics. Он отличается от базового измененным кодом.

Теперь самое интересное. Каждый тег в Диспетчере тегов Google выводится в соответствии с разрешающими и запрещающими правилами.

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

Но так как коды аналитических систем необходимо устанавливать на всех страницах сайта, то мы смело используем базовое правило «Все страницы» и жмем «Сохранить». После чего необходимо еще раз нажать «Сохранить» под всеми настройками тега.

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

После чего мы уже можем произвести публикацию второй версии нашего тега:

Чтобы проверить, что тег опубликован, необходимо вернуться на уровень тега, где рядом c URL сайта можно увидеть, что надпись «не опубликован» исчезла.