Как да интегрираш и използваш Google Tag Manager в онлайн магазина си?

Ориентирането в света на дигиталния маркетинг става е по-лесно с технологии и инструменти, които ни позволяват да изградим стабилна стратегия, докато автоматизираме възможно най-много от процесите. Google Tag Manager е един от тях.

В тази статия ще ти разясним повече за същността на Google Tag Manager и каква е технологията зад инструмента. Ще разбереш какви са предимствата му, как да го настроиш, какво са цели и как да ги проследяваш чрез Google Tag Manager.

Най-накрая ще ти обясним и как си взаимодейства Tag Manager с друг инструмент на Гугъл – Google Analytics.

Да действаме!

Какво е Google Tag Manager и как работи?

Google Tag Manager (бълг. Гугъл тагов мениджър; накратко GTM) е безплатен инструмент от Гугъл, който позволява на маркетолозите да интегрират тагове (малки парчета код) в своя уеб сайт или приложение, без да е необходимо да разчитат на разработчици.

Целта му е да предостави лесен начин за проследяване на събития на сайта, които дават информация за потребителите и техния начин на интеракция със страниците, продуктите и останалите компоненти от фронт-енда (частта от сайта, насочена към потребителите) на един онлайн магазин. 

С помощта на таговете се събират важни метрики и маркери, правещи възможни дълбинен анализ на потребителските пътеки и определяне на целите, нужни за оптимизиране на маркетинговите фунии и повишаване на конверсиите.

За пръв път GTM се появява през 2012 г. и веднага успява да облекчи бремето от сравнително сложните за създаване и управление маркетингови тагове по сайтовете и приложенията за електронна търговия, наложени дотогава. Допреди това собствениците на онлайн магазини трябваше да ползват услугите на разработчици за добавяне на тагове и за цялостното им управление, а това беше времеемко и забавяше процеса по пускане на реклами и маркетингови кампании.

Гугъл знае, че бързината и гъвкавостта на всички инструменти при създаване, проследяване и управление на съдържание, са от съществено значение, затова и въвежда Google Tag Manager като решение на много от проблемите, с които маркетинговите екипи се борят. Това е и важен урок за същината на един успешен продукт – избери проблем, който все още не е решен, и предложи едно оптимизирано решение.

Технологията на решението, избрано от Гугъл, е всъщност не толкова сложна, но е изпипана и затова се използва толкова. GTM работи, като създава контейнер (англ. container), който се инсталира в основния код на уебсайта. В контейнера се съдържат тагове, задействания (тригъри; англ. triggers) и променливи, като всеки елемент е със специфична функция. 

Нека си представим, че сандъкът е пълен с различни инструменти за строене, които да представляват таговете. Всеки инструмент при строителството се използва за различен етап от процеса. При таговете е същото – с един се измерва колко посетители има уебсайтът, с друг се отчита кога някой е направил покупка и т.н. 

Всички тагове, както инструментите, имат едно-единствено предназначение – да ти дадат контрол върху процеса; в случая – върху управлението на маркетинговите ти стратегии. И тъй като не всеки притежава уменията на строител (разработчик), инструментите в сандъка са опростени до такава степен, че всеки може да ги използва, без да е нужно да знае как да кодира.

Това е тайната зад технологията и успеха на Google Tag Manager! Нека сега видим какви са предимствата, ако решиш да използваш услугата.

Основни предимства при използване на Google Tag Manager

С помощта на GTM можеш да подобриш маркетинговите си стратегии чрез употреба на тагове и събиране на данни за събития, задействани от потребителите по време на тяхното посещение в сайта ти. 

Какви обаче точно са предимствата при използването на Google Tag Manager? Нека видим.

• Подобряване скоростта при зареждане на уебсайта. Асинхронното (в различни времена) зареждане на тагове всъщност е една от ползите при употреба на GTM. Така различните части от сайта зареждат паралелно, вместо да се чака обработката на една част от страницата, която може да не е оптимизирана.
  
• Удобно управление на таговете. Единна платформа за управление на всички тагове е по-добре от гмуркане в код всеки път, щом се наложи да бъде добавян, променен или изтриван един таг.
  
• Проследяване на специфични събития. Веднъж настроени, таговете в GTM действат автоматично и събират информация за събитията на уебсайта или приложението ти. Това включва кликове върху дадени бутони, изтегляне на файлове, време на престой и много други.
  
• Лесно сътрудничество. Различните отдели и екипи могат по-лесно да работят заедно поради достъпността на платформата. Същевременно разработчиците се концентрират върху други аспекти на уебсайта, докато маркетолозите управляват таговете.
  
• Интеграция с Google продукти и други платформи. Още една черта на достъпността на GTM е способността да се добави към Google Analytics, Google Ads и други инструменти на Гугъл, както и различни платформи от трето лице като Facebook Pixel.

Как да настроиш Google Tag Manager?

Потенциалът на Google Tag Manager може да бъде усетен само, когато услугата бъде настроена правилно. За да няма съмнение, че и при теб работи безотказно, сме подготвили обяснение за настройката на всеки от основните елементи.

Профил и контейнер

Най-напред трябва да имаш профил в Google Tag Manager. Твоят Гугъл акаунт прави връзка с услугата и позволява да се задейства основната организационна единица в GTM. Можеш да добавяш много контейнери в профила си, въпреки че обикновено се създава по един за всеки уебсайт или за всяко мобилно приложение. 

Видовете контейнери са:

• Web и AMP: за сайтове; получаваш отрязък код, който да поставиш в кодовата структура на сайта си;
• iOS и Android: за мобилни приложения; получаваш линк към документацията на съответната платформа с повече инструкции;
• Server: за сървъри избираш дали да свържеш един сървър ръчно или автоматично.

За създаването на профил и контейнер следвай стъпките долу:

1. Посети основната страница на GTM и натисни върху бутона Start for free. 
2. Ако си влязъл в Гугъл акаунта си (препоръчваме да ползваш фирмения), ще се пренесеш на страница, където се вижда едно табло. Оттам натисни върху бутона Create new profile.
3. В полетата въведи информацията за своята фирма, избери държавата и избери вида контейнер.

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

Инсталацията на контейнер към сайт се случва, след като си създал първия си контейнер с Web настройката избрана. Ето какви са стъпките:

1. Кликни върху Workspace, щом отвориш профила си в GTM.
2. В горния десен ъгъл ще видиш идентификационния номер на контейнера си (container ID), който ще е форматиран така: GTM-XXXXXX. Натисни върху номера.
3. Ще се отвори кутията за настройка, която ще съдържа код. Копирай и постави двете парчета код в сайта си според зададените инструкции в кутията.

В случай че използваш система за управление на съдържание (CMS), можеш да влезеш в административния панел и да потърсиш плъгина на Google Tag Manager. Така няма нужда да добавяш ръчно кода.

Ако не си наясно какво са <head> и <body>, накратко те са част от HTML структурата на един сайт, като първото съдържа информация, невидима за потребителите, но важна за браузъра и търсачките, а второто е същинското съдържание на твоята уеб страница, видимо от потребителите, включително текст, изображения, видео и т.н. 

Ето как да се ориентираш в такъв случай:

1. Отвори файла на сайта си (например index.html) в платформата, която използваш или ако файлът е локален, с текстови редактор .
2. Потърси този елемент: <head>. Мястото, където той завършва, изглежда така: </head>.
3. Постави първото парче код, предоставено от GTM, възможно най-близо началото на елемента <head>.
4. Сега потърси елемента <body> по същия начин.
5. Постави втория код от GTM възможно най-близо до началото на елемента <body>.
6. Запази промените във файла и обнови сайта си или ако правиш редакцията локално, качи файла обратно в уеб сървъра.

Tags (тагове/маркери)

Таговете са малки парченца код, които събират информация за потребителското поведение на твоя сайт или приложение. При управление на маркери помага да се ползват и други инструменти като Google Analytics и Facebook Pixel за по-голяма точност при обработката на данни.

Възможно е да се задават тагове за конкретен сайт или мобилно приложение, като така лесно се следят различни типове дейности и по-нагледно се открива разликата в потребителските действия. 

За нагласата на различните тагове и кодови фрагменти се следват следните стъпки:

1. Влез в Google Tag Manager акаунта си и избери съответния профил и контейнер.
2. Натисни Tags от менюто вляво.
3. Щракни върху New, за да създадеш нов таг.
4. Именувай тага така, че да е лесен за намиране и организиране в бъдеще.
5. Щракни върху Tag Configuration и избери типа маркер.
6. В зависимост от избрания тип предостави нужната информация или въведи допълнителните настройки като ID.
7. В раздела Triggering избери кога тагът да се активира. Ако нямаш съществуващи Triggers, можеш да създадеш нов (обясняваме за това в следващия подраздел).
8. Щракни върху Save, за да съхраниш тага.

Triggers (задействания)

Тригърите или задействанията в GTM определят условията – кога и къде – таговете да се активират. Това може да е, когато потребителят извърши определено действие (пр. кликне върху бутон), когато определена страница се зареди или при друго конкретно събитие.

Подобно на таговете можеш да добавяш и тригъри от страницата на съответния контейнер:

1. В съответния контейнер избери Triggers от менюто вляво.
2. Кликни върху New, за да създадеш нов тригър.
3. Дай му подходящо име за качествена организация.
4. Щракни върху Trigger Configuration и избери типа на тригера от списъка.
5. В зависимост от избрания тип настройките може да варират, но принципът е еднакъв – да решиш при какви условия да се задейства тригърът.
6. Щракни върху Save, за да съхраниш тригъра.

Variables (променливи)

Променливите съдържат информация, полезна за по-специфична настройка на тагове и тригъри. Те могат да са динамични (променящи се във времето) или статични (постоянни). Например променливи са URL адреси, стойности във формуляри, кликнати елементи и пр.

За да добавиш променлива направи следното:

1. В съответния контейнер избери Variables от менюто вляво.
2. Щракни върху New, за да създадеш нова променлива.
3. Дай смислено име на променливата за лесно откриване.
4. Натисни върху Variable Configuration и избери типа променлива от списъка.
5. В зависимост от избрания тип настройките може да са различни. Например за URL трябва да се определи дали да е пълен URL, хост, път и т.н.

Data layer (слой данни)

Слойът данни е ключов компонент на GTM, без който качеството на функционалностите в платформата не е същото.

Това е централизирано място, където се съхраняват и управляват данни относно потребителските действия. Тези данни по своему могат да се ползват при задействане на тагове, да бъдат прехвърляни за допълнителна обработка в Google Analytics, Facebook Pixel и др.

Такива порции информация се наричат точки на данни (англ. data points). Това са единици информация, измерващи и придаващи стойност на определени елементи. Например такива са ID на продукта, име на продукта, сума на поръчката и т.н.

Слоят данни е JavaScript обект, който прехвърля информация от сайта ти към контейнера в GTM. Като такъв, той лесно може да бъде интегрират към стандартен уебсайт. 

Добавянето на слой данни към уеб страницата ти е също толкова лесно като свързването на контейнера със сайта:

1. Добави към <head> секцията от уеб страницата си и над парчето код за контейнера:
   
   <script>
       window.dataLayer = window.dataLayer || [];
   </script>
   
2. Сега можеш да добавяш информация към слоя данни с командата dataLayer.push(). Отдолу ще намериш пример, както е в сайта на Гугъл:
   
   <a href=”#” onclick=”dataLayer.push({
       ‘bookCategory’: ‘fiction’,
       ‘bookTitle’: ‘Cien años de soledad’,
       ‘bookAuthor’: ‘Gabriel García Márquez’
   });”>Book details</a>

Ако не си сигурен как да го направиш, препоръчваме да се консултираш с разработчик. В случай че предпочиташ да разчиташ на доказано надеждна работна ръка, можеш да избереш един от плановете на NEXT BASKET и бързо и лесно да задействаме всичко, без да трябва да се занимаваш с технически настройки.

Проследяване на цели чрез Google Tag Manager

Следенето на целите е задължително за организираността на рекламните кампании. Целите (англ. goals) в Google инструментите измерват ефективността на маркетинговите усилия и дават възможност да разбереш какво работи най-добре за потребителите и клиентите на твоя онлайн магазин. Така максимизираш постепенно възвръщаемостта на инвестициите си.

Целите са конкретни действия, които искаш потребителите да предприемат, когато посетят сайта ти или отворят приложението на електронния ти магазин. Примери за такива са покупка на продукт, абониране за нюзлетър (брошура), попълване на формуляр за контакт и пр. Google Tag Manager позволява настройката на тагове и тригъри за събиране на данни, когато потребителите изпълнят зададените цели.

Преди да а проследяваш цели чрез Google Tag Manager, трябва да си направиш профил в Google Analytics. 

Щом го имаш, можеш да следваш следните стъпки за свързването на двете платформи: 

1. От началното табло в GTM отиди на Add a New Tag;
2. Въведи името на тага (пр. Google Analytics) в полето най-отгоре;
3. Кликни на Tag Configuration и избери Google Analytics – Universal Analytics;
4. Сега можеш да въведеш какви данни да събираш. Избери Track Type според предпочитанията си;
5. Под Google Analytics Settings избери New Variable;
6. Ще се отвори нов прозорец, който ще изисква да се въведе Tracking ID на профила ти в Google Analytics 4. Тази информация се намира в твоя Гугъл Аналитики административен панел (назъбеното колело) под менютата Property > Data Streams. 
7. Кликни на съответния дата поток и избери Configure tag settings – оттам копирай ID номера, започващ с “G-” или “AW-”;
8. На същото меню, където избра Tag Configuration, се насочи към долната секция Triggering и кликни на бутона;
9. Ще се отвори страницата, изискваща да избереш обхват на анализа – Choose a trigger. Кликни на All pages за събиране на данни от всичките страници в уеб сайта ти.

Как взаимодействат Google Tag Manager и Google Analytics?

Използването на GTM заедно с GA дава голяма свобода при събирането и анализирането на данни, тъй като двата инструмента изпълняват отделни функции добре, но в екип действат отлично. 

С Google Tag Manager настройваш и управляваш маркери (тагове), събиращи данни за потребителското поведение, а с Google Analytics анализираш събраните данни по удобен и достъпен начин. Двете платформи работят заедно толкова добре поради общия си собственик – Гугъл, който е оптимизирал отделните функции на всяка услуга.

Източници и ресурси

1. Информация за Google Tag Manager – https://developers.google.com/tag-platform/tag-manager
2. Настройка и инсталиране на Tag Manager – https://support.google.com/tagmanager/answer/6103696#zippy=%2Cwhat-is-an-account
3. Tag Manager за уеб страници – https://developers.google.com/tag-platform/devguides/add-tag?solution=gtag 
4. Информация за променливите – https://support.google.com/tagmanager/answer/7683056?hl=en&sjid=2252428275600504024-EU 
5. Слой за данни в GTM – https://support.google.com/tagmanager/answer/6164391?hl=en&sjid=2252428275600504024-EU