Настройка Google Optimize с помощью gtag.js

google-optimize-gtag

Еще одна статья в подборку про GTAG.JS! Скорее всего вы уже использовали инструмент от Google, который очень сильно облегчает запуск экспериментов (А/Б тестов) на сайте. Так вот его установка тоже делается с новым тегом и сейчас мы рассмотрим как именно.

Как установить Google Optimize с GTAG

Как и в случае с AdWords настройкой вы включаете Optimize с помощью уже установленного gtag «фреймворка».

Обычный код без Optimize будет выглядеть так:

Включить его можно изменив одну строчку с инициализацией Google Analytics вот так:

OPT_CONTAINER_ID — это ваш идентификатор Google Optimize, он очень похож на GTM ID (например GTM-5JFKQ11).

В итоге полный код gtag с Google Optimize будет таким:

Как избежать «мигания» при эксперименте

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

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

Как видите код расположен сразу после открывающего тега <head>, чтобы загрузить эксперимент максимально быстро. В таком случае «мигания» уже не будет. GTM-XXXXXX в данном случае это ваш Google Optimize ID.

Понравилась статья? Поделиться с друзьями:
Комментариев: 2
  1. poni

    Вот с этим двумя OPT_CONTAINER_ID, GA_TRACKING_ID идентификаторами все понятно, но что за идентификатор optimize_id?

    1. Ruslan (автор)

      Poni, optimize_id это id Google Optimize контейнера, он похож на id Google Tag Manager и посмотреть его можно создав контейнер в Optimize

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: