Метрика

Попередження про збирання статистики

Яндекс.Метрика дозволяє попередити відвідувача сайту про збирання інформації про відвідування і відкласти завантаження коду лічильника на сторінках сайту.

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

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

Приклад
..
<head>
    <meta charset="UTF-8">
    <title>Заголовок сторінки</title>
    <!--У прикладі використовується стиль reset.css. Ви можете використовувати своє рішення.-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
    <!--У прикладі використовується бібліотека <js-cookie для роботи з cookie. Ви можете використовувати своє рішення-->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/js-cookie/2.1.2/js.cookie.js"></script>
    <style>
        * {
            box-sizing: border-box;
        }
        body {
            width: 100 %;
            height: 100 %;
        }
        .cookie-notification {
            position: fixed;
            background-color: rgba(0, 0, 0, .8);
            bottom: 0;
            width: 100 %;
            color: white;
            padding: 15px;
        }

        .cookie-notification_hidden_yes {
            display: none;
        }

        .cookie-notification__header {
            margin-bottom: 10px;
            font-size: 23px;
        }

        .cookie-notification__body {
            margin-bottom: 10px;
        }
    </style>
</head>
<body>
    Контент сайту
    <div class="cookie-notification cookie-notification_hidden_yes">
        <div class="cookie-notification__header">Ми використовуємо cookies</div>
        <div class="cookie-notification__body">Ми збираємо статистику про відвідування сайту за допомогою cookies. Відвідуючи сайт, ви погоджуєтеся з цим</div>
        <div class="cookie-notification__buttons">
            <button class="cookie-notification__button" id="yes">Я згоден</button>
        </div>
    </div>
    <script type="text/javascript">
        var messageElement = document.querySelector('.cookie-notification');

        // Якщо немає cookies, то показуємо плашку
        if (!Cookies.get('agreement')) {
            showMessage();
        } else {
            initCounter();
        }
        // Завантажуємо сам код лічильника одразу
        (function (d, w) {
            var n = d.getElementsByTagName("script")[0],
                s = d.createElement("script"),
                f = function () { n.parentNode.insertBefore(s, n); };
            s.type = "text/javascript";
            s.async = true;
            s.src = "https://mc.yandex.ru/metrika/watch.js";

            if (w.opera == "[object Opera]") {
                d.addEventListener("DOMContentLoaded", f, false);
            } else { f(); }
        })(document, window);

        // Функція додає клас до DOM-елемента. Ви можете використовувати бібліотеку jQuery або інший фреймворк
        function addClass (o, c) {
            var re = new RegExp("(^|\\s)" + c + "(\\s|$)", "g");

            if (!o || re.test(o.className)) {
                return;
            }

            o.className = (o.className + " " + c).replace(/\s+/g, " ").replace(/(^ | $)/g, "");
        }

        // Функція видаляє клас із DOM-елемента. Ви можете використовувати бібліотеку jQuery або інший фреймворк
        function removeClass (o, c) {
            var re = new RegExp('(^|\\s)' + c + '(\\s|$)', 'g');
            if (!o) {
                return;
            }
            o.className = o.className.replace(re, '$1').replace(/\s+/g, ' ').replace(/(^ | $)/g, '');
        }

        // Функція, яка ховає попередження
        function hideMessage () {
            addClass(messageElement, 'cookie-notification_hidden_yes');
        }

        // Функція, яка показує попередження
        function showMessage () {
            removeClass(messageElement, 'cookie-notification_hidden_yes');
        }

        function saveAnswer () {
            // Ховаємо попередження
            hideMessage();

            // Ставимо cookies
            Cookies.set('agreement', '1');
        }

        function initCounter () {
            (function (w, c) {
                function _createCounter () {
                    try {
                        w.yaCounterXXXXXX = new Ya.Metrika({
                            id:XXXXXX,
                            clickmap:true,
                            trackLinks:true,
                            accurateTrackBounce:true,
                            webvisor:true
                        });
                    } catch (e) {}
                }

                // Якщо код лічильника завантажено, то одразу ініціалізуємо лічильник
                if (w.Ya && Ya.Metrika) {
                    _createCounter();
                } else {
                    // Інакше за стандартною схемою
                    (w[c] = w[c] || []).push(function () {
                        _createCounter();
                    });
                }

                saveAnswer();
            })(window, "yandex_metrika_callbacks");
        }

        // Натиснення на кнопку "Я згоден"
        document.querySelector('#yes').addEventListener('click', function () {
            initCounter();
        });
    </script>
</body>
...

де

  • XXXXXX — номер вашого лічильника.