Работа с пользовательскими переменными в GTM

 

Переменные — это такие параметры, у которых могут меняться значения. Они применяются и в триггерах, и в тегах.

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

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

Для начала необходимо убедиться, что в исходном коде сайта присутствует код ГТМ. Если его ещё нет — пора подключить.

Пользовательские переменные для работы с датой и временем

Для вывода всех описанных ниже значений будет применять пользовательскую переменную типа Собственный код JavaScript

Скрипт вывода текущих даты и времени — Timestamp

function() {
 try {
  var timestamp = new Date();
  var time = timestamp.toString().split(' ');
  return time[3]+ " " +time[1]+ " " +time[2]+ " "+time[4];
 } catch(e) {
  return "unknown";
 }
}

Скрипт вывода текущей даты — Timestamp — Date

function() {
 try {
  var timestamp = new Date();
  var time = timestamp.toString().split(' ');
  return time[3]+ " " +time[1]+ " " +time[2];
 } catch(e) {
  return "unknown";
 }
}

Скрипт вывода текущего времени HH:MM:SS — Timestamp — Time HH:MM:SS

function() {
 try {
  var timestamp = new Date();
  var time = timestamp.toString().split(' ');
  return time[4];
 } catch(e) {
  return "unknown";
 }
}

Скрипт вывода текущего времени HH:MM — Timestamp — Time HH:MM

function time() {
  var d = new Date();
  var datestring = ("0" + d.getHours()).slice(-2) + ":" + ("0" + d.getMinutes()).slice(-2);
  return datestring;
}

Скрипт вывода текущего (сегодняшнего) числа — Timestamp — Day of the Month

function() {
 try {
  var timestamp = new Date();
  var time = timestamp.toString().split(' ');
  return time[2];
 } catch(e) {
  return "unknown";
 }
}

Скрипт вывода текущего месяца — Timestamp — Month

function () {
 var timezone = 'Europe/Moscow'
 var localTime = new Date();
 var time = new Date(localTime.toLocaleString('en-US', {timeZone: timezone}));
 var month = new Array(12);
 month[0]= "January";
 month[1] = "February";
 month[2] = "March";
 month[3] = "April";
 month[4] = "May";
 month[5] = "June";
 month[6] = "July";
 month[7] = "August";
 month[8] = "September";
 month[9] = "October";
 month[10] = "November";
 month[11] = "December";
 return month[time.getMonth()];
}

Скрипт вывода текущего года — Timestamp — Year

function() {
 try {
  var timestamp = new Date();
  var time = timestamp.toString().split(' ');
  return time[3];
 } catch(e) {
  return "unknown";
 }
}

Скрипт вывода текущего дня недели — Timestamp — Day of the Week

function () {
 var timezone = 'Europe/Moscow'
 var localTime = new Date();
 var time = new Date(localTime.toLocaleString('en-EN', {timeZone: timezone}));
 var dayOfWeek = new Array(7);
 dayOfWeek[0]= "Sunday";
 dayOfWeek[1] = "Monday";
 dayOfWeek[2] = "Tuesday";
 dayOfWeek[3] = "Wednesday";
 dayOfWeek[4] = "Thursday";
 dayOfWeek[5] = "Friday";
 dayOfWeek[6] = "Saturday";
 return dayOfWeek[time.getDay()];
}

Скрипт вывода часового пояса — Timestamp — TimeZone

function() {
 try {
  var timestamp = new Date();
  var time = timestamp.toString().split(' ');
  return time[5]+ " " +time[6]+ " " +time[7]+ " " +time[8];
 } catch(e) {
  return "unknown";
 }
}

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

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

Также с помощью куки можно вытащить дату первого визита посетителя — это дату создания файла куки Google Analytics.

 

function(){
var regex = new RegExp("_ga=([^;]+)");
var value = regex.exec(document.cookie);
var cookieCreationDate = (value != null) ? new Date(value[1].split('.')[3]*1000) : undefined;

if(typeof(cookieCreationDate)!=="undefined")
{

var year = cookieCreationDate.getFullYear().toString();
var month = (cookieCreationDate.getMonth()+1).toString();
var day = cookieCreationDate.getDate().toString();
cookieCreationDate = (day[1]?day:"0"+day[0]) + "-" + (month[1]?month:"0"+month[0]) + "-" + year;
}

return cookieCreationDate;
}

Данная переменная используется в Google Analytics и предназначена для передачи в Пользовательские определения, а также его можно передать в Яндекс Метрику в Параметры посетителей.

Пользовательские переменные для работы со страницами сайта

Эти переменные могут извлекать данные из HTML-тегов.

Название страницы — Page Title

function() {
  return document.title;
}

Название статьи с помощью тегов разметки Open Graph — Article Title — Open Graph

function (){
 var metaProperty = "og:title";
  var metas = document.getElementsByTagName('meta');
  var content = undefined;
  for (i = 0; i < metas.length; i++){
     if (metas[i].getAttribute("property") == metaProperty){
          content = metas[i].getAttribute("content");
     }
  }
  return content;
}

Название статьи с помощью пользовательской переменной Элемент DOM — Article Title

Необходимо выбрать метод Селектор CSS, а в селекторе элементов прописать

div > header > h1

У каждого сайта может быть свой селектор. Данный селектор приведён для этого сайта.

Раздел статьи с помощью тегов разметки Open Graph — Article Section — Open Graph

function (){
 var metaProperty = "article:section";
  var metas = document.getElementsByTagName('meta');
  var content = undefined;
  for (i = 0; i < metas.length; i++){
     if (metas[i].getAttribute("property") == metaProperty){
          content = metas[i].getAttribute("content");
     }
  }
  return content;
}

Описание статьи с помощью мета-тега Description — Article — metaName — description

function (){
 var metaName = "description";
  var metas = document.getElementsByTagName('meta');
  var content = undefined;
  for (i = 0; i < metas.length; i++){
     if (metas[i].getAttribute("name") == metaName){
          content = metas[i].getAttribute("content");
     }
  }
  return content;
}

Автор статьи с помощью пользовательской переменной Элемент DOM — Article Author

Необходимо выбрать метод Селектор CSS, а в селекторе элементов прописать

div > header > div > span.byline > span

У каждого сайта может быть свой селектор. Данный селектор приведён для этого сайта.

Идентификатор статьи — с помощью значения атрибута id тега article — Article ID

function() {
var articleTag = document.getElementsByTagName("article");
for (var i = 0;i < articleTag.length;i++){
  return articleTag[i].id;
  }
}

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

Переменная Основной файл Cookie

Можно также вытащить имя файла куки Google Аналитики с помощью переменной Основной файл Cookie.

Для этого в Названии cookie необходимо ввести _ga

Результат:

Поделиться ссылкой:

 

Читайте также