Извлечение части URL из ссылки с помощью GTM

Май 05, 2020

Небольшая заметка о том, как можно извлекать определенную часть URL из ссылки для передачи этой информации в инструменты веб-аналитики.

Например, нам необходимо извлечь номер заказа из ссылки вида mysite.ru/order/5e9764cc42c65/success

Задачу усложняет то, что ID транзакции находится не в конце URL-пути, а посередине, а также не имеет вид пары ключ=значение. В последнем случае мы могли воспользоваться пользовательской переменной типа URL и типом компонента Запрос, присвоив ей ключ запроса. Подробнее об этом я писал в этом материале.

Но поскольку у нас этого нет, придется использовать другой способ. Для этого в Google Tag Manager создайте переменную типа Собственный код JavaScript и добавьте в него следующий код:

В GTM это выглядит так:

Извлечение части URL из ссылки с помощью GTM

Код JavaScript (вариант 1)

Эта простая функция, которая состоит из:

function () — объявление функции;

var url = {{Page Path}}.substr(7,13) — объявление переменной url, которой присваивается наше конечное значение части URL.

Page Path — переменная возвращает путь в текущем URL без учета GET-параметров, то есть всего того, что идет в URL после знака вопроса «?» и «&» между параметрами. Например, на странице https://osipenkov.ru/analytics/?utm_source=yandex&utm_medium=cpc&utm_campaign=first в GTM данная переменная вернет значение /analytics

substr(7,13) — метод возвращает указанное количество символов из строки, начиная с указанной позиции. Цифры 7 и 13 означают, что отсчет начинается с 8 символа (игнорируются первые 7 из ссылки /order/5e9764cc42c65/success и извлекаются 13, то есть то количество символов, которое у нас в заказе).

Подробнее о методе читайте в документации Mozilla.

return url — возвращает результат;

В результате мы получаем необходимое значение в переменной (режим предварительного просмотра):

Извлечение части URL из ссылки с помощью GTM

Режим отладки GTM

Если у вас этот путь по символам не изменяется, то вы можете использовать эту конструкцию. В противном случае можно использовать другой, но все в той же переменной типа Собственный код JavaScript:

В Google Tag Manager это выглядит так:

Извлечение части URL из ссылки с помощью GTM

Код JavaScript (вариант 2)

В этом варианте мы используем очень похожую конструкцию, за исключением метода. Метод split( ) используется для строк, чтобы разделить ее на подстроку. В нашем случае мы задаем знак / как разделитель (separator), а в квадратных скобках указываем элемент по счету, который хотим извлечь. Для ссылки в моем примере — это 2 (mysite.ru/[1]order/[2]5e9764cc42c65/[3]success).

Чтобы убедиться, что два варианта кода дают одинаковый результат, воспользуемся режим отладки:

Извлечение части URL из ссылки с помощью GTM

Проверка двух вариантов извлечения части URL

Также можно получать доступ к текущему URL по частям с помощью объекта window.location (BOM, Browser Object Model). Для этого в GTM необходимо использовать переменную типа Переменная JavaScript.

Некоторые примеры:

  • window.location.href возвращает ссылку (URL) текущей страницы;
  • window.location.hostname возвращает доменное имя веб-хоста;
  • window.location.pathname возвращает путь и имя файла текущей страницы;
  • window.location.protocol возвращает использованный веб-протокол (http: или https:).

В Google Tag Manager одна из переменных выглядит так:

Извлечение части URL из ссылки с помощью GTM

Объект location

Объект window.location может записываться без префикса window. Например, для ссылки http://techniqa.ru/order/5e9764cc42c65/success переменные в GTM вернут следующие значения:

Извлечение части URL из ссылки с помощью GTM

Переменные window.location

Извлечение части URL из ссылки с помощью GTM
Метки: ,

Получайте бесплатные уроки и фишки

По контекстной, таргетированной рекламе и аналитике