Google Tag Manager (GTM) – це потужний інструмент, який дає змогу керувати різноманітними тегами (фрагментами коду) на вашому сайті, не вносячи зміни безпосередньо в код сторінок. GTM спрощує процес додавання, редагування та відстеження тегів, таких як Google Analytics, Facebook Pixel, рекламні пікселі та інші, що робить його незамінним інструментом для будь-якого власника інтернет-магазину Shopify.
Переваги використання Google Tag Manager у Shopify
Спрощене управління тегами
GTM дає змогу керувати всіма тегами в одному місці, що спрощує їх оновлення та відстеження.
Прискорення завантаження сайту
GTM завантажує теги асинхронно, що не уповільнює роботу вашого сайту.
Розширені можливості відстеження
GTM дає змогу налаштовувати складні події та відстежувати різні дії користувачів на вашому сайті, що дає вам глибше розуміння поведінки вашої аудиторії.
Гнучкість
GTM дає змогу легко додавати та видаляти теги без необхідності залучати розробників, що економить ваш час і ресурси.
Як додати Google Tag Manager у Shopify
- Створіть акаунт Google Tag Manager на сайті https://tagmanager.google.com/.
- Створіть новий контейнер. Вкажіть назву вашого магазину Shopify. Виберіть тип контейнера “Веб-сторінки”.
- Після створення контейнера ви отримаєте унікальний ідентифікатор (наприклад, GTM-XXXXXX). Цей ідентифікатор знадобиться вам для встановлення GTM на Shopify.
- Встановіть GTM на Shopify.
Спосіб 1: Через панель адміністратора Shopify
- Увійдіть у панель адміністратора Shopify.
- Перейдіть у розділ “Онлайн-магазин” -> “Налаштування”.
- У розділі “Google Analytics” вставте ідентифікатор контейнера GTM у поле “Google Tag Manager ID”.
- Збережіть зміни.
Спосіб 2: Вручну (через код теми)
- Увійдіть у панель адміністратора Shopify.
- Перейдіть у розділ “Онлайн-магазин” -> “Теми”.
- Знайдіть свою поточну тему і натисніть кнопку “Дії” -> “Редагувати код”.
- Відкрийте файл theme.liquid.
- Вставте перший фрагмент коду GTM одразу після відкриваючого тега <head>:
HTML
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({‘gtm.start’:
new Date().getTime(),event:’gtm.js’});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=’dataLayer’?’&l=’+l:”;j.async=true;j.src=
‘https://www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script’,’dataLayer’,’GTM-XXXXXX’);</script>
Вставте другий фрагмент коду GTM одразу після тега <body>:
HTML
<noscript><iframe src=”https://www.googletagmanager.com/ns.html?id=GTM-XXXXXX”
height=”0″ width=”0″ style=”display:none;visibility:hidden”></iframe></noscript>
Замініть “GTM-XXXXXX” на ваш ідентифікатор контейнера в обох фрагментах коду. Збережіть зміни.
Налаштування тегів у GTM
Після встановлення GTM ви можете почати додавати та налаштовувати теги в інтерфейсі GTM. Shopify надає спеціальні інструкції з налаштування тегів Google Analytics і Google Ads. Ви також можете додавати теги інших сервісів, таких як Facebook Pixel. Метрика та інші.