Додавання розмітки за допомогою Google Tag Manager: короткий посібник з додавання структурованих даних через GTM

Ми розповімо про те, як, використовуючи Google Tag Manager, внести на сайт мікророзмітку (Schema). Важливо, що для цього не потрібно бути IT-спеціалістом або мати великий досвід у HTML.

Мікророзмітка — це розмітка сторінок спеціальними знаками, які розуміють пошукові системи. Роботам пошукових систем простіше зрозуміти, що міститься на сторінці.

Якщо мікророзмітка є на сайті, це позитивно позначається на багатьох факторах:

• інформація точніша та структурованіша;
• підвищується швидкість індексації сайту роботами;
• роботам легко зрозуміти суть контенту на сайті, визначити релевантність тексту запитам користувачів;
• з’являється можливість створити розширений фрагмент вихідного тексту або коду програми (сніппет).

GTM: функціонал та нестандартне застосування

Як правильно працювати з GTM

Менеджер тегів від Google — важливий інструмент для управління тегами html та JavaScript на інтернет-ресурсі без втручання програмістів.

У пошукової системи є кілька способів складання підсумкової видачі. Коли користувач вводить запит, Google дає найрелевантніші дані. Іноді на запитання можна побачити, не залишаючи головної сторінки:

Є кілька методів розміщення інформації на інтернет-ресурсі. Але пошукові системи не гарантують того факту, що структуровані дані відобразяться в Google. Проте боти вже знаходять і показують сніпети.

Структуровані дані JSON-LD. Як створити їх розмітку завдяки Google Tag Manager

Дані JSON-LD: як можна додати самостійно

JSON-LD (JavaScript Object Notation for Linked Data) — метод передачі даних за допомогою текстового формату JSON (JavaScript Object Notation).

JSON-LD пов’язаний із структурованими даними, які допускають розміщення на сайті:

• повний інструментарій Knowledge Graph (семантична технологія та база знань);
• розширені сніпети;
• вікно пошуку по інтернет-ресурсу.

Вставляти відомості JSON-LD за допомогою GTM на сторінках дозволяється. Однак, є нюанс — запуск коду має відбутися під час першого завантаження сторінки. Невелике пояснення: розширення структурованих даних неможливе після завантаження вікна. У той час як тригер працює для всіх сторінок, нічого зайвого не повинно бути.

Важливі моменти для включення в Knowledge Graph

Розмітка даних виконується завдяки мікророзмітці Schema. Перерахуємо деякі моменти, здатні полегшити влучення інформації про компанію, бренд у графу знань:

1. розмітка Organization. Варто використовувати не лише саму розмітку, а й властивості (logo, url, name);
2. властивість sameAs. До нього потрібно включити посилання на всі сторінки соціальних мереж.

Ось як виглядає в Knowledge Graph:

Використання розмітки пошуку для інтернет-магазину

Це чудова можливість для сторінки видачі результатів пошуку. Певні сайти дозволяють зробити пошуковий запит у вікні видачі результатів. Подібна схема дозволяє шукати потрібну інформацію на сайті, не заходячи на нього, через внутрішній взаємозв’язок пошукача та безпосередньо інтернет-ресурсу.

Для створення такого пошукового рядка потрібно зробити такий код у HTML-тегу користувача:

У даному випадку вказана адреса сайту та потрібна опція пошукового звернення, на які спирається внутрішній пошук на ресурсі. Тому, якщо користувач пише свій запит на сторінці пошукової видачі в рядку, вказаному вище, користувачі направлять на сторінку підсумкового пошуку по всьому інтернет-ресурсу.

Короткий посібник з додавання мікророзмітки завдяки Google Tag Manager

Додаємо розмітку за допомогою GTM

Для створення даних за допомогою GTM потрібні:

• встановлення та налаштування GTM;
• додавання нового Custom HTML-tag у контейнер;
• впровадження потрібного блоку інформації в tag;
• установка контейнера, а потім — його розміщення у менеджері тегів;
• реалізація тестування;
• перевірка роботи всього вищезгаданого.

Тут ми зупинимося та вивчимо всі етапи додавання мікророзмітки.

Етап №1. Сформуйте власний код розмітки та зробіть перевірку завдяки спеціальному інструменту від Google (перевірка розширених результатів):

Етап №2. Додати новий tag в GTM:

• потрібно вибрати тег HTML користувача;
• після цього вставити код розмітки (етап №1) та вибрати тригер «All pages».

Етап №3. Реалізація перевірки та налагодження. Зверніть увагу на один нюанс: при розміщенні контейнера під написом «Tags Fired On This Page», механізм працює правильно, при розміщенні під написом «Tags Not Fired On This Page» — неправильно. У такому випадку потрібно знайти похибку та усунути її.

Знайте: використання різних даних у тезі HTML можна міксувати. Це рекомендується для зменшення кількості тегів у контейнері.

Також Google Tag Manager дозволяє застосовувати особисті змінні для активніших вставок structured data. При визначенні рівня даних (dataLayer) у шаблоні сторінки можна витягти цю інформацію при використанні рівня даних у межах розмітки structured data. Важливо, щоб рівень мав інформацію, яка є важливою у розмітці даних.

Вказане вище має на увазі, що завдяки застосуванню особистих потужностей коду GTM можна встановити пружну вставку потрібних відомостей. При цьому існує велика ймовірність введення анотації в код JavaScript, щоб не використовувати їх у шаблоні сторінки завдяки системі керування вмістом. Примітно те, що використання об’єкта можна зробити в кожному місці сторінки, не обов’язково в коді «head», що визначає початок і кінець елемента.

Залишилися питання? Задайте їх через Ask Inweb або просто в коментарях до статті.