Особисто я дуже полюбляю різноманітні розширення в Chrome — вони значно розширюють можливості браузера. Але так часто буває, що деякі з них з часом втрачають підтримку своїх розробників.
Розширення PROANALYTICS, про яке сьогодні піде мова, з’явилося досить випадково і його початкова ідея не нова. Я довгий час користувався розширенням, яке підсвічує CSS-селектори на сторінці, і також ним користувалося багато з моїх студентів: воно спрощувало життя і в реальній роботі, і при виконанні ДЗ. Але в певний час те розширення видалили з Chrome, а нових аналогів, які б повністю влаштовували нас за функціоналом, знайти не вдалося. Тому і з’явилася ідея написати свій варіант.
Звісно, якщо вже робити, то одразу з покращенням. Тому розширення не просто підсвічує елементи, а й підказує, чи дійсно ваш селектор охоплює і всі внутрішні елементи. Це було в 2024 році.
Хоча початкова ідея була спростити роботу студентам курсу PRO GTM, з тих пір, якщо вірити статистиці з Chrome Store, розширенням щотижня користується близько 400 користувачів.
«Непоганий результат, як для софта, написаного за декілька годин», — подумав я і вирішив дописати ще трішки нових можливостей.
Цей пост на блозі — короткий перелік поточних можливостей розширення. Сподіваюся, цього буде достатньо, щоб дійти до першої 1000.
Що таке розширення PROANALYTICS для браузера
PROANALYTICS — це розширення для Chrome, яке спрощує роботу маркетологам, PPC-фахівцям, вебаналітикам та всім, хто щодня взаємодіє з GTM і GA4. Воно об’єднує кілька практичних функцій, які допомагають пришвидшити рутинні дії та зробити процес роботи з даними зручнішим.
Що вміє PROANALYTICS
Розширення складається з двох основних блоків: CSS Selector Highlighter і Google Analytics 4. Кожен з них має свою специфіку, але обидва орієнтовані на те, щоб пришвидшити роботу з даними та позбавити зайвої рутини. Почнемо з першого блоку.
Підсвічування елементів, які відповідають CSS-селектору
Як я вже писав, функція підсвічування CSS-селекторів стала першим кроком у створенні PROANALYTICS. Працює наступним чином:
- Коли ви вводите CSS-селектор — наприклад, h3, — розширення миттєво підсвічує всі відповідні елементи на сторінці.
- Одразу ж показується кількість знайдених збігів.
- Якщо один візуальний елемент складається з кількох (наприклад, кнопка разом з іконкою та підписом), розширення показує, чи захоплений увесь компонент, чи лише його частина. Це дозволяє точніше налаштувати тригери в GTM і не пропустити важливі частини елемента.
Звісно, якщо ваш селектор не охоплює всі частини кнопки, розширення про це теж повідомить і навіть підсвітить червоним кольором ту частину, яку ви пропустили.
- Щоб не втрачати контекст під час роботи, можна додати панель розширення прямо на сторінку за допомогою кнопки “Show panel on page”. У такому вигляді вона не зникає після кліку і дозволяє спокійно тестувати селектори без потреби щоразу відкривати розширення заново.
- Останній введений селектор зберігається — навіть після оновлення сторінки або переходу на іншу вкладку.
Усе це робить роботу з селекторами не лише наочною, а й зручною в щоденній практиці — особливо коли доводиться швидко перевіряти, чи коректно налаштовані умови для спрацювання тегів або подій.
Можливості для Google Analytics 4
Друга велика функція PROANALYTICS — це покращення функціоналу GA4.
Умовне форматування таблиць
Основний функціонал - умовне форматування даних у стандартних звітах Google Analytics 4. Він додає візуальні підказки прямо у таблиці, щоб вам було простіше сприймати інформацію без довгого “вчитування” в кожну цифру.
Ця функція з’явилася як відповідь на те, що багато хто досі згадує старе розширення Da Vinci Tools для Universal Analytics, яке додавало “теплові” підсвітки в інтерфейсі. Зараз цього розширення вже немає, тому PROANALYTICS повертає його — і навіть робить дещо більше.
Щоб активувати функціонал, просто ввімкніть опцію «Enable conditional table»:
Детальніше це працює наступним чином:
- У абсолютних показниках (наприклад, кількість подій, сесій, користувачів) у клітинках з’являються горизонтальні барчарти, які відображають частку цього рядка у загальній сумі. Наприклад, якщо у стовпці “Session start” значення для mobile — 15 204, а загальна сума — 16 839, то клітинка заповнена майже повністю, бо це понад 90% від загального показника. Для desktop, де всього 1 577 сесій, смужка буде значно коротшою.
- У розрахункових (відсоткових або середніх) показниках, як-от Engagement Rate або Average engagement time, клітинки змінюють фон залежно від відхилення від середнього значення. Розглянемо це на прикладі Engagement Rate — у нашій таблиці середнє значення становить 59,63%.
- Якщо значення вище за середнє, клітинка підсвічується зеленим.
Наприклад, у рядку Organic Social — 72.62%, що значно перевищує середнє, тому фон зелений. - Якщо значення нижче за середнє, фон буде червоним.
У Unassigned — лише 3.86%, тому клітинка підсвічується червоним. - Якщо значення майже не відрізняється від середнього (менше ніж на 5%), підсвітка не застосовується.
Наприклад, у Email — 57.38%, і ця клітинка виглядає нейтрально. - Ну а чим значення більше відрізняється від середнього, тим яскравішим воно буде, щоб ви точно звернули на нього увагу.
- Якщо значення вище за середнє, клітинка підсвічується зеленим.
Копіювання даних з інтерфейсу
Остання функція розширення може здатися дрібницею, але саме таких дрібниць часто бракує в повсякденній роботі. Йдеться про можливість копіювати дані зі звітів GA4 за допомогою звичної комбінації клавіш Ctrl+C / Command+C.
У стандартному інтерфейсі GA4 скопіювати щось напряму часто просто не вдається. Ви виділяєте текст, натискаєте Ctrl+C — а в буфер нічого не потрапляє. Доводиться натискати праву кнопку миші та шукати «Copy». Це незручно, особливо коли потрібно швидко перенести кілька значень у таблицю, презентацію чи месенджер.
PROANALYTICS вирішує цю проблему. Варто лише активувати опцію “Allow copying data from reports with Ctrl+C | Cmd+C”, і копіювання починає працювати просто: виділили — скопіювали — вставили.
Це лише початок
PROANALYTICS допомагає зекономити час на типових задачах аналітика — від перевірки селекторів до роботи зі звітами GA4. І хоча вже зараз розширення закриває чимало щоденних потреб, це ще не фінальна версія — воно буде оновлюватися і розвиватися.
Тому пробуйте, тестуйте у своїй роботі й діліться фідбеком: саме завдяки вам я зможу покращувати інструмент і додавати ще більше корисних функцій.
Завантаження коментарів…