Подключение Яндекс.Метрики v6 для OpenCart 3 KEY

Настройка электронной коммерции Google Analytics на opencart

По настройке электронной коммерции для Google Analytics написано море статей. Но самое обидное, что на 90% — это просто повторение справки самого Гугла, которая, хочу вам сказать, очень качественная и постоянно обновляется. Однако, когда сталкиваешься с конкретной задачей под конкретный движек – всплывает масса вопросов. Дело в том, что справка написана для людей, понимающих основы javascript. К сожалению, в реальной жизни крайне редко получается просто скопировать код. Зачастую его нужно менять и подстраивать.
Поэтому я и решил написать данную статью. В качестве примера я взял CMS OpenCart, как наиболее распространенный движок для интернет-магазинов. И пошагово напишу, что и куда надо вписать, чтоб у вас заработала электронная коммерция. В этой статье мы рассмотрим классическую (не расширенную) коммерцию. Все что вам нужно для подключения, это доступ к самому Аналитиксу и на ftp вашего сайта, т.к. нужно вносить правки в код.
Конкретно для opencart задача состоит из двух частей. Во-первых, нужно передать данные о заказе на последнюю страницу (index.php?route=checkout/success). А уже во-вторых, передать эти данные в GoogleAnalytics.

Вывод данных о заказе на страницу «Спасибо за покупку»

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

Разумеется формулировки текста и стили вы можете править по своему усмотрению. Для этого переходите на вашем ftp в каталог: \catalog\language\russian\checkout и там открывайте файл success.php, увидите нечто подобное:

Вот то что слева – это переменные, а справа сам текст. Можно использовать html теги. Так что формулировки и прочее придумывайте себе. Кстати, напоминаю, что перед тем, как вносить какие-то изменения, сделайте резервную копию изменяемых файлов, а лучше – всего сайта.
Теперь идем по адресу \catalog\controller\checkout и открываем файл success.php в этой папке. В ней и определяются переменные, которые будут доступны нам на выходе. Находите строки в самом начале:

session->data['order_id'])) {
      $this->cart->clear();

и меняйте на :

data['order_id'] = 0; // Номер заказа
    $this->data['total'] = 0; // Сумма заказа
    $this->data['products1']=0; // Информация о товарах
    if (isset($this->session->data['order_id'])) {
      $this->data['order_id'] = $this->session->data['order_id']; // Номер заказа<
      $this->data['total'] = $this->cart->getTotal(); // Сумма заказа
      $this->data['products1'] = $this->cart->getProducts(); // Информация о товарах
      $this->cart->clear();

Вот эти три переменные нам и нужны. Так же, если вы добавляли новые переменные с текстом (вот тут \catalog\language\russian\checkout) то их нужно обязательно добавить:

Теперь нам нужно настроить вывод этих данных. Для этого идем по адресу: \catalog\view\theme\*ваша_теме\template\common и открываем файл success.tpl
Вносим правки по своему усмотрению. Вот как это сделал я:

Все. Красивая страница с информацией о заказе у вас есть. Переходим к самому главному.

Подключение e-commerce для GoogleAnalytics (напрямую, не через Tag Manager)

Теперь, когда на данной странице есть данные о заказе, все что нам надо, это передать их в Google. И тут мы сталкиваемся с небольшой задачей. Дело в том, что данные у нас хранятся в переменных php, а гугл принимает их через Яваскрипт. Но и это решение уже есть в справке. Я его адаптирую исходя из наших переменных. Перед тем, как начать править код, убедитесь, что у вас включена функция e-commerce в самом аналитиксе:

В том же файле (\catalog\view\theme\*ваша_теме\template\common\success.tpl) нужно вписать следующий код (в начало файла):

$order_id,
         ‘revenue’=>$total);
// Копируем в переменную items наши покупки, чтоб код был максимально похож на исходный.
$items = $products1;
// Переводим данные из php в JS для транзакции
function getTransactionJs(&$trans) {
  return <<

И внизу страницы добавляем:

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

Подключение через Google Tag Manager

Если вы продвинутый пользователь, и работаете через Таг Менеджер, подключение происходит немного иначе. Чтоб не копировать опять код, я просто опишу. Данные передаются в dataLayer. Для этого вы аналогично используете функцию перевода php а JS а затем вызываете ее. Смотрите скрин:

Важный момент: этот код должен быть подключен ДО кода tag manager.

 
Последнее, что вам нужно сделать, это зайти в tag manager и создать там соответствующий тег, который будет активировать комерцию. Выбирайте тип отслеживания: Транзакция, условия активации: некоторые страницы -> страница содержит checkout/success
Не забудьте опубликовать данное изменение.

Прошу обратить внимание на возможные ошибки!

В работе столкнулся с такой проблемой. Если у вас в названиях используются кавычки (одинарные ‘ или двойные «) будьте осторожны, они могут ломать код яваскрипта! Для этого экранируйте их, или используйте разные типы.
Вообще, одинарной кавычки в тексте быть не должно, это спецсимвол. Используйте вместо него апостроф ` (перед 1 который).
В любом случае, всегда тестируйте изменения на сайте и следите за ошибками в консоле.
Спасибо за наводку Станиславу Тимонову, Интернет-магазин Bowandtie Shop Gallery.

Купить модуль-Yandex Metrika Цели и электронная комерция.

Доступные варианты

Помощь с установкой

Требуется установка

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

Отправка параметров посетителей.
    Этот инструмент может быть полезен для формирования отчета на основе данных, полученных в момент, когда посетитель находится на сайте. Чтобы посмотреть статистику, используйте отчет «Параметры посетителей». Также, используя эти данные, можно формировать сегменты для подбора аудитории в Яндекс.Директе или в Яндекс.Аудиториях. Вы можете настроить передачу следующих данных:
        — идентификатор посетителя может принимать значения: номер сессии или идентификатор зарегистрированного пользователя в системе OpenCart;
        — тип посетителя: гость или зарегистрированный;
        — группу покупателя, если пользователь зарегистрирован;
        — дата регистрации, если пользователь зарегистрирован;
        — статус безопасности аккаунта, который присваивается зарегистрированному пользователю при модерации;
        — статус подписки на рассылку новостей, если пользователь зарегистрирован;
        — страна указанная в адресе зарегистрированного пользователя по умолчанию;
        — регион указанный в адресе зарегистрированного пользователя по умолчанию;
        — город указанный в адресе зарегистрированного пользователя по умолчанию;
        — почтовый индекс указанный в адресе зарегистрированного пользователя по умолчанию;
        — а так же значения дополнительных настраиваемых полей зарегистрированных пользователей!

Отправка данных электронной коммерции — eCommerce.
    Это инструмент который предоставляет возможность сбора и анализа данных, относящихся к области электронной коммерции — eCommerce. Переданная информация отображается на сайте Яндекс.Метрики в группе отчетов «Электронная коммерция».

        Передача данных осуществляется при действиях произведенных с товаром или набором товаров:
        — при просмотре карточки (страницы) товара;
        — при добавлении товара в корзину;
        — при удалении товара из корзины;
        — при успешном оформлении заказа.
    Для более актуальной статистики, так же передаются данные о добавлении или удалении, если количество товара в корзине было изменено.
    Внимание! Данные о добавлении, удалении или заказе, могут передаваться не всегда или не передаваться вовсе, в случае с некоторыми модулями заменяющими форму оформления заказа. Данные электронной коммерции успешно передаются при использовании стандартной формы оформления заказа OpenCart, при использовании модулей Simple и FastOrder. С другими модулями работа не гарантируется!

        При осуществлении перечисленных действий могут передаваться следующие данные:
        — производитель товара;
        — полная ветка категорий товара, но только при просмотре карточки (например: «категория 1/категория 2»);
        — позиция товара в списке, если значение не равно 0;
        — цена товара, включая налоговую ставку;
        — количество товара на складе, кол-во при добавлении или удалении в корзине, и кол-во в совершенном заказе;
        — разновидность товара, то есть перечисляются выбранных опций товара через запятую.

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

Отправка данных о достижении целей.
    Цель — это действие посетителя, в котором заинтересован владелец сайта: посещение конкретной страницы, нажатие кнопки, переход по ссылке, оплата заказа и т. д. Когда пользователи приходят на ваш сайт и взаимодействуют с ним, Яндекс.Метрика собирает информацию об этом и фиксирует достижение целей. Информация по целям в интерфейсе Яндекс.Метрики доступна в отчете «Конверсии», а также во всех стандартных и пользовательских отчетах, построенных по визитам.

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

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

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

        Если вы хотите получать более многосторонние данные о действиях посетителей вашего интернет-магазина, тогда советуем установить другой наш модуль «TS Google Analytics». Сервис Google Analytics является зарубежным аналогом Яндекс.Метрика и обладает похожим функционалом. Используя оба сервиса, вы будете иметь возможность сравнить их отчеты, найти золоту середину, а значит лучше понять своих клиентов, снизить уровень расходов и повысить доходы.

        Так же предлагаем вашему вниманию пакет модулей «TS AB-Test 3 в 1». Это набор простых, но мощных маркетинговых инструментов для повышения эффективности ваших баннеров, слайдеров, HTML текстов и любых других элементов дизайна в OpenCart, с помощью аналитического метода «АБ-тестирование» (Split test). Благодаря этому пакету модулей, вы сможете лучше донести до посетителя нужную информацию, и тем самым значительно повысите конверсию вашего интернет-магазина.

Инструкция по установке:
    1) Перейдите в Панель администратора -> Модули -> Установка расширений;
    2) Просто загрузите архив с модулем для вашей версии OpenCart или ocStore;
    3) Добавьте в группе пользователей «Администратор» права доступа к модулю;
    4) Обновите кэш модификаторов;
    5) Активируйте и настройте модуль.
Если вы пропустите пункт 3, то во время включения модуля, могут не создаться необходимые для работы таблицы базы данных и модуль будет работать не корректно.

 !    Файлы не перезаписываются.
 !    Используется OCMod.

Инструкция по обновлению:
    1) Удалите модификатор предыдущей версии модуля;
    2) Перейдите в Панель администратора -> Модули -> Установка расширений;
    3) Просто загрузите архив с модулем для вашей версии OpenCart или ocStore;
    4) Обновите кэш модификаторов;
    5) Проверьте настройки модуля и пересохраните.

cart.

 (json[]) {

(json, );

cart.

success: {

(json, );

Подключение электронной коммерции для Яндекс. Метрика

Электронная коммерция, почему-то, у большинства ассоциируется исключительно с Google.Analytics. (Подробная статья по установке екоммерса от Google на opencart тут). Однако, в Яндекс.Метрике есть аналогичный функционал по отслеживанию этапов продаж, например, вот:


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

• detail — просмотр товара (например, заход в карточку товара или клик по кнопке «подробнее» в каталоге товаров);
• add — добавление товара в корзину, как правило срабатывает по нажатию кнопки «купить»;
• remove — удаление товара из корзины;
• purchase — оформление покупки (успешная транзакция).

Как видите, тут нет шагов оформления, тем ни менее, этой информации вполне достаточно для анализа продаж, источников, слов, эффективности страниц, наиболее популярных товаров и прочее.
В первую очередь, нам нужно активировать работу электронной коммерции. Для этого нужно перейти в настройки счетчика и на вкладке «Код счетчика» отметить чекбоксом соответствующий пункт (для этого у вас должны быть права администратора. Гостям эта функция недоступна). После этого в коде появится соответствующая строка.
Если у вас на сайте стоит код без включенной коммерции, его нужно заменить (просто проверьте наличие данной строчки в коде на странице сайта):

Кстати, по умолчанию стоит контейнер dataLayer. Лучше не меняйте его. Но если измените, учтите, что это новое имя нужно будет использовать ВЕЗДЕ. Дело в том, что Analytics использует точно такое же название в TagManager, и если у вас корректно будет настроена коммерция через ТагМенеджер для аналитикса, в Метрике она должна заработать автоматически, т.к. они используют единые команда. Но об этом поговорим в отдельной статье.
Итак, вы включили коммерцию и заменили код на сайте. Теперь, самое интересное: подключение сайта.

Настройка кода для ecommerce в метрике на примере opencart

Надеюсь, тут по аналогии все понятно: мы используем команду purchase, как ранее использовали add или detail. Только не перепутайте id транзакции и id товара. Первое – это номер заказа, который вы выдаете покупателю. Второе же – это артикул конкретного товара.
Хочу отметить, что на этапе продажи можно фиксировать и цель. Для этого она должна ,быть задана как Javascript-событие (любое, пишите туда что хотите). Важно – посмотрите ID этой цели на странице списка целей. Все что вам нужно, добавить строчку «goal_id» : «777» (вместо 777 – ваш ID цели).
В результате код превратиться в нечто такое:



Автор Grek