Всім привіт, друзі. Вирішив потихеньку продовжувати поповнювати блог публікаціями по роботі та налаштування Google Analytics. Сьогодні буде невелика, але від цього не менш корисна замітка про те, як відстежувати 404 помилки (404 Not Found) на сайті. Але не просто відстежувати, а отримувати ще дуже корисну інформацію: адресу сторінки, яка віддала помилку і сторінку реферер (сторінку з якої був здійснений перехід). Сподіваюся, ви розумієте всю користь цього методу.

Адже якщо у вас великий сайт з десятками тисяч сторінок, то відстежити биті внутрішні посилання – завдання не з легких. Хоча і на сайті з парою сотень сторінок (а це будь-який середньостатистичний блог) теж проблематично знайти неправильні посилання. А якщо ще і структуру url’ов міняли, то взагалі…

Коротше, я сподіваюся, що у вас вже давно встановлений лічильник GA на сайті, при цьому він новій версії (асинхронний код). Так адже? Якщо ще не встановили лічильник, то зробіть це, так як поступово я планую написати багато корисних публікацій про налаштування та відстеження важливих подій на сайті.

Вистачить води, приступаю до справи.

Для вирішення поставленого завдання (відстежити биті посилання і отримати при цьому максимум корисної інформації) нам нічого надприродного не знадобиться, а всього лише простий код:

<script type=“text/javascript”>
_gaq.push([‘_trackPageview’, ‘/error404?page=’ + document.location.pathname + document.location.search + ‘&from=’ + document.referrer]);
</script>

_gaq.push([‘_trackPageview’, ‘/error404?page=’ + document.location.pathname + document.location.search + ‘&from=’ + document.referrer]);

Я розумію, що я не перший, хто про це пише, але всі варіанти, знайдені мною в мережі, або для застарілого коду GA, або взагалі не працюють, бо я експериментував, поки не отримав робочий варіант.

Отже, уявімо, що ми зараз працюємо з движком WordPress, а тому йдемо в адмінку -> вигляд -> Редактор -> Шаблон помилки 404 (404.php)

Далі у будь-яке місце цього файлу вставляємо вказаний вище код. Я вставляв код відразу після заголовка

Помилка 404 Не знайдено

.

Я думаю, що і для всіх інших більш або менш пристойних движків є окремий шаблон виводу повідомлення про помилку. Наприклад, для DLE в папці свого шаблону треба знайти файл info.tpl і туди вставити цей код.

Пропоную зараз ще раз поглянути на код і зрозуміти, що ж він робить і які дані визначає:

‘/error404?page=’ + document.location.pathname + document.location.search + ‘&from=’ + document.referrer

‘/error404?page=’ + document.location.pathname + document.location.search + ‘&from=’ + document.referrer

Розбираємо:

  • location.pathname – повертає шлях до е.
    Наприклад, для сторінки http://alaev.info/blog/post/2784 буде повернуто значення /blog/post/2784
  • location.search – повертає запит до е.
    Наприклад, для сторінки http://alaev.info/[email protected] буде повернуто значення [email protected]
  • document.referrer – повертає url документа з якого був здійснений перехід, іншими словами реферер.
    Приклад, я вважаю, не потрібен, і так все зрозуміло 😉

Тепер повернемося до коду Google Analytics:

_gaq.push([‘_trackPageview’, ‘/error404?page=’ + document.location.pathname + document.location.search + ‘&from=’ + document.referrer]);

_gaq.push([‘_trackPageview’, ‘/error404?page=’ + document.location.pathname + document.location.search + ‘&from=’ + document.referrer]);

Цей код передає в статистику перегляд сторінки, а нашому випадку це буде віртуальна сторінка /error404 з наступними параметрами, обумовленими JS-скриптом, описаними вище.

Тепер ми знаємо, як це працює, прийшов час розповісти про деякі особливості:

  • Код для відслідковування помилок повинен ОБОВ’ЯЗКОВО йти після основного коду GA. Тобто, якщо код GA стоїть у вас в футері, то це не спрацює, треба перенести код ближче до початку документа, наприклад, поставити його відразу після відкриваючого тега .
  • Код відстеження помилки генерує віртуальну сторінку додатково до переданої сторінці, віддає помилку 404, стандартним кодом. Тобто при перегляді сторінки з помилкою в статистиці фіксується перегляд відразу двох сторінок, самої неіснуючої сторінки і віртуальної сторінки /error404.
  • Особливостей попереднього пункту можна уникнути лише в тому випадку, якщо на всіх сторінках сайту у вас буде вставлений стандартний код GA, а в шаблоні сторінки помилки буде змінений код GA.

    Наприклад, на всіх сторінках сайту такий код:

    <script type=“text/javascript”>
    var _gaq = _gaq || [];
    _gaq.push([‘_setAccount’, ‘UA-ХХХХХХХХ-X’]);
    _gaq.push([‘_trackPageview’]);
    (function() {
    var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;
    ga.src = (‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;
    var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(ga, s);
    })();
    </script>

    var _gaq = _gaq || [];
    _gaq.push([‘_setAccount’, ‘UA-ХХХХХХХХ-X’]);
    _gaq.push([‘_trackPageview’]);
    (function() {
    var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;
    ga.src = (‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;
    var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(ga, s);
    })();

    А на сторінці помилки такий:

    <script type=“text/javascript”>
    var _gaq = _gaq || [];
    _gaq.push([‘_setAccount’, ‘UA-ХХХХХХХХ-X’]);
    _gaq.push([‘_trackPageview’, ‘/error404?page=’ + document.location.pathname + document.location.search + ‘&from=’ + document.referrer]);
    (function() {
    var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;
    ga.src = (‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;
    var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(ga, s);
    })();
    </script>

    var _gaq = _gaq || [];
    _gaq.push([‘_setAccount’, ‘UA-ХХХХХХХХ-X’]);
    _gaq.push([‘_trackPageview’, ‘/error404?page=’ + document.location.pathname + document.location.search + ‘&from=’ + document.referrer]);
    (function() {
    var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;
    ga.src = (‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;
    var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(ga, s);
    })();

Після всіх налаштувань дані про помилки можна знайти у звіті: Зміст -> Вміст -> Сторінки -> в формі пошуку пишемо «error404». В новому інтерфейсі (інтерфейс GA, до речі, змінюється чи не кожен місяць, так що будьте уважні) звіт розташований тут: Поведінка -> Вміст -> Всі сторінки -> в формі пошуку так само пишемо «error404».

Ніби і все. Вибачаюся за те, що в пості немає скріншотів, помилок у мене немає на блозі (це добре, зрозуміло), а тестові помилки показувати якось не круто.

Сподіваюся, ці налаштування вам допоможуть покращення вашого сайту. А ще не забудьте прочитати ще один мій пост про Google Analytics: Вчимо Google Analytics розуміти пошуковий трафік!

З повагою, Олександр Алаєв