6. Настройка Диспетчера тегов
План урока:
6.1 Установите тег Google Analytics
6.2 Переменная ресурса Google Analytics
6.3 Настройка междоменного отслеживания
6.4 Уровень данных
6.1 Как настроить тег Google Analytics "Просмотр страницы"
Как создать аккаунт и контейнер
Чтобы добавить на сайт тег Диспетчера тегов, сначала нужно создать аккаунт и контейнер, затем создать тег и протестировать его – убедиться, что он работает без ошибок. Чтобы создать аккаунт в Диспетчере тегов, на странице tagmanager.google.com введите учетные данные своего аккаунта Google и нажмите "Войти".
Для работы в Диспетчере тегов Google нужен по крайней мере один аккаунт. Вам будет предложено создать его после первого входа в Диспетчер тегов. Введите название аккаунта, а затем нажмите кнопку "Далее".
Теперь нужно настроить контейнер. Укажите в его названии сайт, на который будут добавлены теги. Поскольку The Great Outdoors Travel Adventures – это веб-сайт, в разделе "Где будет использоваться контейнер" выберите вариант "Интернет". Также можно добавить домен и часовой пояс, но в этом примере мы не будем этого делать. Теперь нажмите кнопку "Создать аккаунт и контейнер", а затем примите Условия использования.
В Диспетчере тегов откроется окно с кодом контейнера. Скопируйте его и вставьте сразу после открывающего тега <body> на каждой странице сайта. Если вам снова понадобится этот код, откройте раздел "Администратор", выберите нужный контейнер, а затем – "Установить Диспетчер тегов Google". Мы также можем добавить теги, но сейчас нажмите кнопку "Добавить теги позже".
После создания аккаунта и контейнера откроется панель управления контейнером. Здесь можно добавлять теги, просматривать, какие теги сейчас редактируются и какие контейнеры уже опубликованы, а также создавать примечания и просматривать историю изменений. В разделах на панели слева можно создавать и изменять теги, настраивать триггеры, а также встроенные и пользовательские переменные.
На вкладке "Аккаунты" отображается список всех доступных вам аккаунтов. Также здесь перечислены все контейнеры, созданные в том или ином аккаунте, их тип и идентификатор. Чтобы создать новый аккаунт, нажмите на ссылку "Создать аккаунт" вверху. Назовем этот аккаунт The Great Outdoors.
Как создать тег Google Analytics
В компании The Great Outdoors хотят изучить поведение пользователей с помощью Google Analytics. Поэтому для начала мы добавим стандартный тег "Просмотр страницы". Чтобы добавить тег на сайт, откройте раздел "Теги" и нажмите кнопку "Создать" или выберите "Новый тег" на этой странице. Воспользуемся вторым вариантом.
Чтобы присвоить тегу название, нажмите на поле "Тег без имени". Чтобы упростить работу с тегами, мы будем называть их следующим образом: вначале тип тега, потом — название сайта и местонахождение тега.
Выберите Google Analytics и тип тега Universal Analytics. Нажмите "Далее".
Чтобы добавить идентификатор отслеживания Google Analytics, откройте в Google Analytics вкладку "Администратор" и нажмите "Настройки ресурса". Также этот идентификатор можно найти на вкладке "Главная страница" в папке "Аккаунт".
Чтобы воспользоваться ремаркетингом и получать демографические данные Google Analytics, установите флажок "Включить функции для контекстно-медийной сети". В раскрывающемся меню "Тип отслеживания" выберите вариант "Просмотр страницы" и нажмите "Далее".
Для отслеживания просмотров нужно, чтобы этот тег срабатывал на каждой странице сайта, поэтому выберите триггер "Все страницы". Ниже появится подтверждение выбранного триггера. Нажмите "Создать тег".
Тег отслеживания страниц Google Analytics появился в списке тегов.
Как опубликовать тег Google Analytics
Вы создали первый тег. Теперь нажмите кнопку "Опубликовать". Появится окно с общим числом изменений, которые будут опубликованы.
Чтобы проверить измененные контейнеры перед запуском, нажмите "Предварительный просмотр". Вверху страницы отображается версия просматриваемого тега.
В новой вкладке браузера откроем сайт Travel Adventures. В режиме предварительного просмотра в нижней части окна откроется панель с информацией о тегах, которые были активированы.
Как видите, тег отслеживания сработал, как только мы загрузили страницу. Убедившись, что тег работает, вернитесь в Диспетчер тегов и нажмите кнопку "Опубликовать". Затем в окне подтверждения нажмите "Опубликовать сейчас".
Появится сообщение, что изменения контейнера вступили в силу.
Нажмите "Выйти из режима предварительного просмотра".
Тег также можно проверить, открыв в Google Analytics отчеты "В режиме реального времени". Если число активных пользователей и просмотров страниц изменяется, значит, всё в порядке.
На вкладке "Версии" можно управлять версиями тегов, например восстановить предыдущую или сохранить новый вариант контейнера.
Итак, вы узнали, как опубликовать тег на сайте с помощью Диспетчера тегов
6.2 Как создать переменную ресурса Google Analytics
Чтобы сэкономить время и избежать ошибок при обновлении ресурса в теге Google Analytics, мы рекомендуем создать повторно используемую переменную ресурса Google Analytics.
В меню слева откройте раздел "Переменные". Вы увидите список встроенных переменных, а ниже – пользовательские переменные. Нажмите кнопку "Создать".
Затем нажмите на значок карандаша в поле "Переменная без имени". Укажите название gaProperty.
Чтобы несколько тегов могли ссылаться на значение этой переменной, в разделе "Выбор типа переменной" выберите "Константа".
Чтобы обновлять значение ресурса Google Analytics из одной переменной, в разделе "Настройка переменной" необходимо указать идентификатор ресурса Google Analytics. Затем нажмите кнопку "Создать переменную".
Теперь вы сможете использовать созданную переменную в Диспетчере тегов, не указывая каждый раз идентификатор ресурса.
Давайте посмотрим, как это работает. Заменим идентификатор ресурса в теге "Просмотр страницы" на созданную нами переменную типа "Константа". Откройте раздел "Теги". Выберите созданный ранее тег Google Analytics "Просмотр страницы".
В разделе "Настройка тега" нажмите кнопку рядом с полем "Идентификатор отслеживания". Выберите {{gaProperty}} и сохраните тег.
Чтобы просмотреть контейнер, нажмите "Опубликовать", а затем – кнопку "Предварительный просмотр". Если мы перейдем на сайт The Great Outdoors Travel Adventures, то на панели предварительного просмотра увидим, что тег Google Analytics активирован.
Итак, мы создали переменную, с помощью которой можно обновлять значения на всем сайте. Как видите, это несложно.
6.3 Как создать переменные для междоменного отслеживания
Если вы хотите объединить данные с нескольких сайтов в одном отчете Google Analytics, настройте междоменное отслеживание.
Сначала нам нужно создать две пользовательские переменные с постоянными значениями (константы): gaDomain и gaCrossDomains.
Создание переменной gaDomain
По умолчанию переменная gaDomain сохраняет файлы cookie в домене самого высокого уровня, чтобы избежать потери данных с субдоменов. Переменная gaCrossDomains позволит ссылаться сразу на весь список доменов, а не указывать домен при каждом обновлении тега.Выберите "Переменные" на панели слева. Нажмите кнопку "Создать". Назовем эту переменную gaDomain. Выберите тип "Константа". Укажите значение auto, чтобы файлы cookie для этой переменной автоматически сохранялись в домене верхнего уровня. Затем нажмите кнопку "Создать переменную".
Создание переменной gaCrossDomains
Теперь настроим переменную gaCrossDomains. Снова нажмите "Переменные" на панели слева. Нажмите "Создать". Выберите тип "Константа". Назовем эту переменную gaCrossDomains.
В поле "Значение" через запятую укажите домены сайта The Great Outdoors – greatoutdoorsretail.com и greatoutdoorstraveladventures.com. Затем нажмите кнопку "Создать переменную".
Добавление междоменных переменных в Universal Analytics
Теперь нам нужно добавить междоменные переменные в тег "Просмотр страницы" Universal Analytics, созданный ранее. Откройте раздел "Теги" и выберите тег "Просмотр страницы".
Чтобы задать домен для файлов cookie, нажмите на значок "Изменить" в разделе "Настройка тега". Затем раскройте дополнительные настройки, выберите "Поля, которые необходимо задать" и нажмите кнопку "+ Поле". В качестве названия поля укажите cookieDomain. Чтобы присвоить значение первой переменной, нажмите на кнопку выбора значения и выберите {{gaDomain}}.
Теперь откройте раздел "Междоменное отслеживание". Нажмите на селектор возле поля "Автоматическое связывание доменов" и выберите переменную gaCrossDomains, созданную ранее. В полях "Использовать решетку в качестве разделителя" и "Изменение внешнего вида форм" оставьте значения False. Эти параметры используются в строке запроса, а также для структурирования информации в нескольких доменах – сейчас они нам не понадобятся.
Нажмите "Далее", а затем – "Сохранить тег".
После публикации этих изменений вы сможете использовать тег "Просмотр страницы" Google Analytics для сбора данных из разных доменов. Данные о трафике для всех отслеживаемых доменов будут доступны в Google Analytics в режиме реального времени.
6.4 Что такое уровень данных
Есть два способа сбора данных с помощью Диспетчера тегов. В первом информация извлекается непосредственно из исходного кода веб-сайта или браузера. Например, можно получать ее посредством JavaScript из файлов cookie, из существующих переменных JavaScript или напрямую из атрибутов HTML-тегов.
Во втором способе информация передается в другие приложения с помощью уровня данных. Мы настоятельно рекомендуем использовать этот метод, потому что так изменения исходного кода не будут прерывать процесс сбора информации.
Уровень данных в Диспетчере тегов – это объект JavaScript, в котором хранятся различные сведения, переданные с веб-сайта (например, информация о пользовательских событиях или переменные). Информация в этом объекте структурируется с помощью пар "ключ-значение". Их можно передавать в сторонние приложения (например, в Google Analytics) или использовать в качестве триггеров, которые определяют, когда нужно активировать теги.
Добавлять пары "ключ-значение" на уровни данных можно двумя способами.
Подстановка значений на уровень данных
Первый способ заключается в подстановке значений на уровень данных во время загрузки веб-страницы. Рассмотрим пример. Компания The Great Outdoors предлагает на своем сайте Travel Adventures несколько туристических пакетов с учетом категории и выбранной страны. Для этого можно использовать переменную {{tripCategory}} уровня данных. Ее значение задается в зависимости от вида отдыха, который предлагается на странице (например, hiking (походы), skiing (катание на лыжах), scuba (дайвинг) и т. п.).
Также можно добавить переменную {{tripLocation}}, в которой указывается направление поездки (страна, город и т. д.).
Чтобы показывать рекламу пользователям, которые уже покупали туры определенной категории в ту или иную страну, можно создать триггер на основе просмотра страницы, дополнительно указав в нем, что переменные {{tripCategory}} и {{tripLocation}} должны принимать значения "hiking" (походы) и "Switzerland" (Швейцария) соответственно. В таком случае триггер активирует тег для показа объявления о походах в Швейцарии. Нажав на него, пользователь снова попадает на страницу, где можно купить этот тур. Тег получит доступ к этим значениям и будет активирован при загрузке страницы, если код уровня данных размещен перед фрагментом кода контейнера.
Добавление значений в уровень данных с помощью JavaScript-метода push
Второй способ заключается в прямой передаче значений с веб-страницы на уровень данных с помощью JavaScript-метода push. Предположим, на сайте The Great Outdoors Travel Adventures есть корзина, в которую пользователи асинхронно добавляют туры, не обновляя страницу. Веб-мастер компании может написать код JavaScript, который будет передавать эту информацию на уровень данных, когда пользователь выберет тур.
Таким образом можно собирать данные независимо от тегов, загружаемых вместе со страницей.
Обратите внимание, что переменные уровня данных не передаются автоматически на другие страницы. Для этого вам нужно написать специальный код.
Как видите, уровни данных можно использовать не только для передачи информации в другие приложения, но и в качестве контейнера для написания и редактирования кода, на который не повлияют изменения на сайте.