Шаблон тега «Отправка ecommerce-событий» в Яндекс Тег Менеджере

10 декабря 2025 года в Яндекс Тег Менеджере появился новый шаблон тега - Отправка ecommerce‑событий. В этом руководстве вы узнаете, для чего он нужен и как настроить его работу.

Начало

Электронная коммерция (e-commerce) в Яндекс Метрике - это набор отчетов и инструментов для детального анализа поведения покупателей и эффективности интернет-магазина, позволяющий:

• получать подробную информацию о товарах и заказах, средней стоимости заказов, конверсии в покупку, времени до совершения покупки и других показателях;
• повышать эффективность кампаний в Яндекс Директе с помощью стратегий Максимум конверсий с ограничением по доле рекламных расходов;
• определять, какие товары наиболее популярны, чаще добавляются в корзину или покупаются, а также какие промокоды используются чаще всего;
• анализировать рентабельность рекламных каналов;
• изучать и выделять наиболее платежеспособную аудиторию сайта.

Чтобы данные появились в отчетах, нужно передавать в Метрику информацию о товарах и суммах, которые посетители вашего сайта:

• просматривают,
• добавляют в корзину,
• удаляют из корзины,
• покупают.

Именно эти события фиксирует Метрика и формирует на их основе статистику в отчетах.

У Яндекса есть даже целый отдельный сайт (промо-страница), который посвящен электронной коммерции (включая чек-лист), а также:

• официальная справка Яндекс Метрики по настройке ecommerce-событий;
• и с появлением нового шаблона тега теперь еще официальная документация Яндекс Тег Менеджера.

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

Наверняка вы знаете, что в веб-аналитике и системах электронной коммерции широко используется уровень данных (dataLayer). Это стандартный способ передачи структурированных данных о действиях пользователя, товарах, транзакциях и т.д. Сам уровень данных - это, как правило, объект, в который вы можете помещать нужную информацию (события, переменные и прочие данные), а затем передавать ее в сторонние сервисы, в Google Analytics 4, Facebook *, Яндекс Метрику, VK Рекламу, Criteo OneTag и др.

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

Читать еще:

• Способы формирования dataLayer - напрямую и через Google Tag Manager
• Извлечение данных из dataLayer

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

dataLayer является центральным механизмом в Google Tag Manager. Именно через него GTM получает данные для тегов, триггеров, переменных. Электронная торговля в Google Analytics 4 завязана на уровне данных. В пикселе VK Рекламы тоже есть dataLayer (слой данных), при активации которого по мере поступления новых событий они будут регистрироваться и отображаться на вкладке События.

Но вы могли встречать dataLayer даже если никогда не работали с продуктами Google и VK. Например, в интерфейсе Яндекс Метрики при настройке электронной коммерции:

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

В настройках счетчика включается параметр ecommerce: "dataLayer" (также вы можете инициализировать счетчик с параметром ecommerce: true), после чего Метрика автоматически считывает из него события. На момент публикации этой статьи в Яндекс Метрике доступны следующие события электронной коммерции:

1. impressions - просмотр списка товаров;
2. click - клик по товару в списке;
3. detail - просмотр товара;
4. add - добавление товара в корзину;
5. remove - удаление товара из корзины;
6. purchase - покупка;
7. promoView - просмотр внутренней рекламы;
8. promoClick - клик по внутренней рекламе.

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

Как видите, в конструкции присутствует dataLayer. Но на самом деле Яндекс Метрика не зависит от наличия dataLayer, в отличие от Google Tag Manager. Хотя если на сайте уже используется dataLayer (например, для GA4 или GTM), она умеет читать из него данные об электронной торговле.

Яндекс Метрика работает с объектом ecommerce, но он может быть передан внутри dataLayer:

Или в глобальной переменной:

Другими словами, Метрика читает данные из объекта, а не из GTМ-структуры dataLayer. То есть ей не нужно событие event и другие GTM-специфичные вещи.

Просто dataLayer стал де-факто индустриальным стандартом для передачи данных, который принят многими системами (Google Analytics 4, VK Реклама, TikTok, Facebook и др.), и часто разработчики используют его как единый источник данных, даже если конкретная аналитическая система его необязательно требует.

Традиционно настройку электронной торговли на сайте сначала проводили для Google Analytics 4 из-за максимального количества событий и с использованием dataLayer. А затем интернет-маркетолог, используя сформированный и подготовленный уровень данных, передавал данные о ecommerce в нужную рекламную/аналитическую систему. Одна настройка для множества сервисов - очень удобно!

Существует несколько способов формирования dataLayer:

1. написать техническое задание (ТЗ) разработчику с просьбой сформировать уровень данных на отслеживаемый элемент, и при совершении event отправлять пользовательское событие;
2. самостоятельно сформировать уровень данных через Google Tag Manager/Яндекс Тег Менеджер, и при совершении пользователем события (event) так же отправлять пользовательское событие.

Первый способ подробно разобран в официальной документации Яндекса и в моем онлайн-курсе по Яндекс Метрике. Если вы хотите научиться составлению такого технического задания и проверки всех настроек и ecommerce-событий, обязательно изучите все доступные материалы.

Мы же остановимся на втором варианте, поскольку опубликованный Яндексом новый шаблон тега Отправка ecommerce-событий в Яндекс Тег Менеджере как раз предназначен для самостоятельной отправки ecommerce-событий в Яндекс Метрику.

Про DOM Scraping

Перед тем, как вы начнете читать данный материал, я предполагаю, что у вас есть общее представление о браузерах, HTTP-запросах, DOM (объектной модели документа), HTML, селекторах CSS и асинхронном коде JavaScript. Именно такие знания вам понадобятся, если вы планируете извлекать нужную вам информацию со страницы веб-сайта для последующей ее передачи в инструменты веб-аналитики. Я надеюсь, что вы также предварительно познакомились с моим руководством по настройке стандартной электронной торговли с помощью диспетчера тегов Google для лучшего понимания приведенной ниже информации (устарело, но база осталась), а еще прочитали статью о переменной «Элемент DOM» в Яндекс Тег Менеджере.

Использование dataLayer значительно расширяет способы отслеживания. Однако не всегда есть возможность своими собственными силами сформировать уровень данных с необходимым набором параметров. В этом случае мы, как правило, обращаемся за помощью к разработчику. Например, для формирования уровня данных электронной торговли, или отслеживания динамического ремаркетинга, функции User ID и т.д. Использование готовых плагинов для популярных CMS-систем тоже является хорошим вариантом решения. Но и это не всегда возможно. Программист может быть занят своими делами, и в ближайшее время не приступит к выполнению вашей задачи, или его в команде может вообще не быть, и тогда придется искать кого-то на стороне. А в случае с готовыми решениями для веб-сайтов - его может не существовать... Что же делать?

Тогда нам нужно формировать уровень данных самостоятельно. Сделать это можно с помощью Яндекс Тег Менеджера. Технология получения веб-данных путем извлечения их со страниц сайтов по-английски называется DOM Scraping (Web scraping). Это означает, что вы можете извлечь данные из элементов, которые уже существуют на странице - заголовки страниц, классы, идентификаторы, URL-адреса и т.д., и собрать это все в собственный уровень данных, не дожидаясь помощи разработчиков.

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

Как извлечь это значение? Если вы обладаете навыками работы с JavaScript, то наверняка знаете, что извлечь текстовое значение со страницы можно с помощью команды:

, где: вместо CSS-селектор вы должны подставить значение для своего HTML-элемента.

Эта команда находит первый подходящий элемент по селектору и возвращает его видимый текст в виде строки.

С помощью свойства innerText можно извлечь со страницы идентификатор заказа или сумму покупки, наименования товаров, их количество и т.д. и т.п.:

Пример извлечения бренда/производителя:

И затем все полученные/извлеченные значения со страницы можно поместить в отдельные переменные Элемент DOM в Яндекс Тег Менеджере и вместе с тегом отправить в аналитику.

Подробнее о том, как это делать, читайте в этом руководстве.

У меня есть видео из онлайн-курса Google Tag Manager (2020), в котором я показываю способ настройки стандартной электронной торговли для Universal Analytics, позволяющий получить доступ к информации на странице веб-сайта из DOM-дерева, с помощью Google Tag Manager и веб-скрапинга (Web Scraping). Да, сами сервисы и их демонстрация устарели, но принцип сбора данных со страницы сайта остался прежним. Технология web scraping за это время не так сильно поменялась.

Познакомившись с фундаментальными темами и понятиями, приступаем к изучению практической части работы с шаблоном тега Отправка ecommerce-событий в Яндекс Тег Менеджере.

Включить электронную коммерцию

Сначала нужно активировать электронную торговлю внутри Яндекс Метрики. Для этого в настройках счетчика включите опцию Электронная коммерция.

Обновите код счетчика на страницах вашего сайта. Убедитесь, что он на сайте содержит строку ecommerce:"dataLayer"

Выбор передаваемых ecommerce-событий и данных

Перед тем, как начать использование нового шаблона тега в Яндекс Тег Менеджере, вам необходимо определить:

• какие конкретно ecommerce-события вы будете отправлять в Яндекс Метрику;
• какие данные о товарах будут переданы вместе с этими событиями.

На момент публикации этой статьи в Яндекс Метрике доступны следующие события электронной коммерции:

1. impressions - просмотр списка товаров;
2. click - клик по товару в списке;
3. detail - просмотр товара;
4. add - добавление товара в корзину;
5. remove - удаление товара из корзины;
6. purchase - покупка;
7. promoView - просмотр внутренней рекламы;
8. promoClick - клик по внутренней рекламе.

В качестве примера я продемонстрирую настройку двух событий - добавление товара в корзину (add) и покупку (purchase).

Помимо самих событий, вы должны еще отправлять данные о товарах. В Яндекс Метрике объект с данными о товарах может содержать следующие поля:

• идентификатор товара (id) - например, SKU. Необходимо обязательно указать или id, или name;
• название товара (name) - например, Футболка. Необходимо обязательно указать или name, или id;
• бренд (brand) - торговая марка, ассоциированная с товаром (например, Яндекс или Yandex);
• категория товара (category) - категория, к которой относится товар. Поддерживается иерархия категорий до 5 уровней вложенности. Разделителем уровней является символ /. Например, Одежда / Мужская одежда / Футболки;
• вариант товара (variant) - разновидность товара. Например, Красный цвет;
• цена (price) - цена единицы товара. Например, 6999;
• количество (quantity) - количество единиц товара.

Подробнее о структуре данных товаров читайте в официальной справке Яндекса.

Причем есть обязательное поле (идентификатор товара/id или название товара/name), без которого передача ecommerce-данных просто невозможна. Поэтому в шаблоне тега Отправка ecommerce-событий мы должны будем указывать как минимум значение для этого поля.

Когда пользователь совершает заказ на вашем сайте, то помимо информации о купленных товарах в Яндекс Метрику передаются еще данные о заказе, а именно:

• идентификатор покупки (id) - например, 91234. Это поле обязательно для заполнения
• валюта (currencyCode) - трехбуквенный код валюты в формате ISO 4217. Если передается другая валюта, будут отправлены нулевые значения вместо валюты и суммы;
• промокод (coupon) - промокод, ассоциированный со всей покупкой целиком;
• сумма заказа (revenue) - полученный доход от транзакции. Если не указан, вычисляется автоматически как сумма цен всех товаров, ассоциированных с покупкой.

И в нем тоже есть обязательное поле - это идентификатор покупки (id).

Подробнее о структуре данных заказа читайте в официальной справке Яндекса.

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

• идентификатор товара/id или название товара/name - структура данных о товарах;
• идентификатор покупки (id) - структура данных о заказах.

Вроде бы не так сложно, как кажется. Но чтобы их извлечь, эти данные на страницах вашего сайта должны быть. Если их нет, то и извлекать нечего. Поэтому перед тем, как настроить электронную торговлю для Яндекс Метрики, вам необходимо проверить наличие этих данных, чтобы с помощью Яндекс Тег Менеджера и соответствующих переменных их можно было бы извлечь.

Если идентификатор товара или название товара, а также идентификатор покупки отображаются на сайте, то мы можем двигаться дальше.

Создание переменных для передачи данных

Перейдите в Яндекс Тег Менеджер и откройте вкладку Переменные.

Создайте новую переменную типа Элемент DOM:

Первое, что вам нужно задать, это Метод выбора. Вам нужно сообщить Яндекс Тег Менеджеру, какой именно элемент веб-сайта вас интересует. Всего существует два метода выбора:

1. Идентификатор (выбор элемента по его идентификатору);
2. Селектор CSS (выбор элемента по его селектору CSS).

Если у элемента есть id, тогда вы копируете его и вставляете в поле Идентификатор элемента.

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

Подробно все это разбирается в этом руководстве. Здесь не будем углубляться в CSS-селекторы, так как данное руководство фокусируется на настройке нового шаблона тега для отправки ecommerce-событий.

Сначала создадим переменную для извлечения значения названия товара. Для этого перейдем на страницу товара и проинспектируем данный элемент. Как только мы найдем его в структуре DOM-дерева, скопируем селектор:

После этого возвращаемся в Яндекс Тег Менеджер и в поле Селектор элемента вставляем скопированную конструкцию:

Задав название переменной (например. Название товара), сохраняем ее.

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

• CSS-селекторы в Google Tag Manager. Часть I
• Селекторы в jQuery. Часть II
• Регулярные выражения в CSS-селекторах и GTM
• CSS Selector Tester и его аналоги
• Google Tag Manager и jQuery
• Редактирование элементов на странице с помощью Google Tag Manager
• Подмена текста динамически на странице с помощью Google Tag Manager
• Подмена контента на сайте с помощью Google Tag Manager
• Динамическая подмена контента на сайте с помощью Google Tag Manager

Хоть они и написаны с использованием примеров для диспетчера тегов Google, тема CSS-селекторов является фундаментальной, поэтому читая все вышеприведенное, вы можете ставить знак равенства Google Tag Manager = Яндекс Тег Менеджер.

И обязательно посмотрите подробную лекцию на эту тему. Rutube:

И YouTube:

Поскольку для объекта с товарами в качестве обязательного поля мы будем использовать название самого товара, то идентификатор товара (id) извлекать не нужно (ИЛИ название - ИЛИ идентификатор).

Создайте еще одну переменную типа Элемент DOM. Только теперь она нам будет нужна для извлечения идентификатора покупки.

Перейдите на свой сайт и выполните тестовый заказ. Найдите на странице покупки ID заказа. Проинспектируйте этот элемент точно так же, как вы это делали ранее для названия товара. Как только вы найдете HTML-элемент в структуре DOM-дерева, скопируйте его селектор:

Вернитесь в Яндекс Тег Менеджер и в поле Селектор элемента вставьте скопированную конструкцию:

Задав название переменной (например. Идентификатор покупки), сохраните ее.

Создание триггеров для ecommerce-событий

Поскольку ecommerce-события срабатывают на разные действия, нам необходимо создать отдельные триггеры для каждого из них. Например, добавление товара в корзину (add) регистрируется тогда, когда пользователь нажимает на кнопку В корзину:

А событие покупки (purchase) срабатывает тогда, когда пользователь попадает на страницу, URL-адрес которой содержит такие параметры: /checkout/order-received/.../?key=....

Значит для добавления товаров в корзину я могу создать триггер типа Клик - Все элементы с дополнительным условием активации только по конкретным кнопкам В корзину:

И триггер просмотра страницы покупки:

Это лишь примеры для моего тестового сайта. У вас эти условия будут другими!

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

Отправка ecommerce‑событий

После всех проделанных настроек пришло время попробовать новый шаблон тега от Яндекса - Отправка ecommerce‑событий. Для этого перейдите на вкладку Теги и добавьте новый тег:

В открывшемся окне выберите Отправка ecommerce-событий:

Далее из выпадающего списка выберите нужное событие. Поскольку в этом руководстве я демонстрирую два события (добавление товара в корзину и событие покупки), то поочередно выберу каждое из них. Сначала настрою для add:

После этого вам откроются поля шаблона, которые необходимо заполнить.

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

Я не стал усложнять и без того непростое руководство, а показал, как извлечь обязательные поля для ecommerce-событий:

• идентификатор товара/id или название товара/name - структура данных о товарах;
• идентификатор покупки (id) - структура данных о заказах.

Обязательные поля отмечены красной звездочкой в шаблоне тега:

Первое событие в моем примере - это добавление товара в корзину (add). Чтобы заполнить обязательное поле Название товара и сослаться в нем на нашу переменную Элемент DOM, которую мы создали на предыдущем шаге, нам необходимо использовать фигурные скобки {{ }}. Просто начните вводить, а затем выберите из выпадающего списка нужную переменную:

Поскольку в шаблоне тега для данного события больше нет обязательных полей, осталось только добавить триггер и задать название для тега (например - Ecommerce - Добавление товара в корзину):

В официальной документации Яндекс Тег Менеджера есть пример со всеми заполненными данными (для просмотра товара):

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

1. просмотр товара;
2. добавление товара в корзину;
3. удаление товара из корзины;
4. завершение покупки;
5. отображение промо-баннера;
6. клик по промо-баннеру.

Второе событие (и последнее) в моем примере - это покупка (purchase). Поэтому выбрав тип события Завершение покупки, я заполню необходимые поля шаблона тега. Здесь их уже два:

1. ID заказа
2. Название товара

Поскольку мы их создали на предыдущем шаге, я просто указываю ссылки на созданные переменные в фигурных скобках {{ }}:

Но здесь есть очередное НО. Ранее мы извлекали значение название товара на странице самого товара. А поскольку событие покупки срабатывает на другой странице, то в момент оформления заказа наша переменная может не принимать нужного значения. Следовательно, будет ошибка.

Вот как это выглядит на моем тестовом сайте:

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

Конечно же, вариант, при котором вы пишите техническое задание разработчику с просьбой сформировать уровень данных на отслеживаемый элемент, и при совершении event отправлять это событие - самое лучшее и точное решение. Но не всегда это возможно. Именно поэтому команда Яндекса добавили такой шаблон в Яндекс Тег Менеджер.

Осталось только добавить триггер и задать название для тега (например - Ecommerce - Покупка):

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

Сохраните полученный тег.

Проверка настроек

Последний шаг - это отладка выполненной работы. Для этого запустите режим предварительного просмотра. Выполните нужное действие на сайте (просмотр товара, добавление в корзину и другие).

Убедитесь, что событие сработало и данные корректно передаются в dataLayer. Вы также можете запустить панель отладки от Яндекс Метрики, добавив параметр _ym_debug=2 в конец ссылки:

Событие purchase я проверю именно так. Совершив тестовый заказ, я перейду на страницу завершения покупки. Открыв режим отладки Яндекс Метрики, на вкладке Ecommerce я должен увидеть событие purchase с переданными обязательными полями:

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

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

Вот пример передачи события purchase с большим количеством заполненных данных:

Чем больше заполнено данных, тем лучше! В завершение не забудьте опубликовать контейнер Яндекс Тег Менеджера, чтобы настройки применились ко всем пользователям вашего сайта.

Полезные ссылки:

• Как проверить настройки электронной коммерции