Добрый день, уважаемые читатели.
Когда новый сайт запущен на орбиту, думаю, любому разработчику интересно узнать, как часто и кем его сайт посещается. Хорошо бы при этом знать и сопутствующую статистику сайта по посещениям.
Для сайтов на WordPress есть специальные плагины для анализа посещений. Вроде бы такую услугу и хостер предоставляет. Я эти способы почти не использую. Может быть позже поделюсь опытом. Стараюсь обходиться обычными средствами, т. е. ставить счётчики от поисковых систем. В первую очередь, ставлю счётчики Гугла и Яндекса. В интернете есть много статей о том, как установить счётчики посещений сайта от Google и Yandex. Как зарегистрировать свой сайт в поисковых системах и получить коды счётчиков для установки на свой сайт - этого я излагать не буду - попробуйте самостоятельно - это несложно. Если интересно, могу рассказать отдельно. А пока опишу практическую часть.
Допустим, код счётчика мы получили и думаем о том, как внедрить этот счётчик на свой сайт. Разберём пример.
Код счётчика от Яндекса
Вот такой код моему сайту достался (ещё информер можно было выбрать, но о нём - позже):
<!-- Yandex.Metrika counter --> <script type="text/javascript"> (function (d, w, c) { (w[c] = w[c] || []).push(function() { try { w.yaCounter36483216 = new Ya.Metrika({ id:36483216, clickmap:true, trackLinks:true, accurateTrackBounce:true }); } catch(e) { } }); 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, "yandex_metrika_callbacks"); </script> <noscript><div><img src="https://mc.yandex.ru/watch/36483216" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter -->
Этот код счётчика состоит как бы из двух частей:
скриптовой -
<script>между тегами</script>
и нескриптовой -
<noscript><div>блочная часть</div></noscript>
Яндекс рекомендует разместить счётчик ближе к началу страницы. И другие рекомендуют то же. Согласимся: пусть лучше нам посещение зачтут ещё до загрузки "телесной части" (<body>), которая с контентом, футерами-подвалами и боковыми панелями-виджетами может грузиться долго, и до счётчика очередь загрузки может и не дойти.
Вставка кода счётчика в WordPress
Смотрим, как устроены наши страницы, генерируемые кодом WordPress. В теме Nirvana, которую я использую, часть java-скриптов загружается и описывается в заголовке страницы (между тегами <head></head>): см. объявления типа <script type= … - в результирующем html-коде.
Будет логично и скриптовую часть счётчика поместить тут же (в заголовок страницы). Для этого открываем в редакторе файл header.php нашей WordPress-темы и вставляем скриптовую часть кода, например, перед закрывающим тегом </head>. Не забудьте обрамить вставленный код комментариями (см. например, как в оригинале от Yandex.Metrika), чтобы потом не путаться: позже в это место добавятся коды других счётчиков или ещё какие-нибудь нужные скрипты.
Что касается нескриптовой части счётчика: её в заголовке лучше не размещать. Это, правда, не запрещается - размещать блоки div внутри head, но валидатор (http://validator.w3.org/) на это будет ругаться и посчитает за ошибку. В теме Nirvana, установленной на моем сайте, прописано в самом начале страницы <!DOCTYPE html>, то есть подразумевается использование стандарта HTML 5, но в валидаторе этот стандарт вроде как в стадии эксперимента, и я оставляю в его опциях - автоопределение. Поэтому, чтобы соблюсти "чистоту кода", лучше разместить нескриптовую часть счётчика внутри тегов <body> страницы </body>. Для этого можно отредактировать тот же файл header.php, потому что в его коде как раз открывается тело страницы тегом <body>. Но я решил "загнать" нескриптовые половинки счётчика в самую конечную часть страницы - поближе к её закрытию (перед закрывающим тегом </body>). Для этого я прописал нескриптовую часть счётчика в файл подвала WordPress-темы: footer.php.
Кстати, а что если нескриптовую часть совсем удалить, а скриптовую часть оставить? Оказывается, при определенных условиях, даже "половина" счётчика будет работать, т. е. засчитывать посещение. Детальней о работе счётчика читайте у разработчика здесь https://yandex.ru/support/metrika/general/how-it-works.xml
Что делать с информером? Для сбора статистики информер не нужен. Статистика будет собираться тем кодом, который приведен выше. А информер обычно используется для отображения числа посещений прямо на страницах сайта, ну или так, красоты ради или понтов. Где и как его размещать я расскажу ниже.
Код счётчика от mail.ru
Имеет похожую структуру: есть скриптовая и нескриптовая части - как и у счётчика Яндекса. Поэтому я его тоже разделил на две части, которые поместил в заголовок и тело страницы, соответственно.
Код счётчика Google
Этот код состоит полностью из скрипта:
<script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-69548327-2', 'auto'); ga('send', 'pageview'); </script>
Поэтому я разместил его в заголовке страницы, прописав в header.php.
Код счётчика LiveInternet
Я выбрал раздельный вариант кода: одна часть - сам счётчик (невидимая часть), вторая часть - логотип. Сервис LiveInternet нам тоже подсказывает, где лучше разместить код невидимого счётчика: для более точного учета посещаемости его нужно вставить как можно ближе к началу страниц, но после тега <body> - это я прописываю в header.php:
<!--LiveInternet counter--><script type="text/javascript"><!-- new Image().src = "//counter.yadro.ru/hit?r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+ ";"+Math.random();//--></script><!--/LiveInternet-->
Видимая часть - представляет собой логотип (информер):
<!--LiveInternet logo--><a href="//www.liveinternet.ru/click" target="_blank"><img src="//counter.yadro.ru/logo?45.13" title="LiveInternet" alt="" border="0" width="31" height="31"/></a><!--/LiveInternet-->
- его буду размещать с другими информерами в отдельном месте.
Код счётчика Rambler
Рамблер рекомендует поместить свой код перед закрывающим тегом </body>
<!-- begin of Top100 code --> <script id="top100Counter" type="text/javascript" src="http://counter.rambler.ru/top100.jcn?4421078"></script> <noscript> <a href="http://top100.rambler.ru/navi/4421078/"> <img src="http://counter.rambler.ru/top100.cnt?4421078" alt="Rambler's Top100" border="0" /> </a> </noscript> <!-- end of Top100 code -->
Разделять такой script на две части и помещать их раздельно в заголовок и body-часть страницы не рекомендуется: в этом коде уже прорисовывается информер (логотип) - поэтому буду помещать этот код в то место, где размещу остальные информеры.
Размещение информеров
Пока пойду простым путём и размещу информеры в отдельном виджете в правой колонке.
Для этого использую виджет типа "Текст" (с некоторых пор стало возможным использовать виджет типа HTML), в который просто вставлю коды информеров (пока только Rambler, mail.ru и LiveInternet). Например вот так, тупо - сплошняком (вставив лишь между счетчиками пробелы), без форматирования:
<!-- begin of Top100 code --><script id="top100Counter" type="text/javascript" src="http://counter.rambler.ru/top100.jcn?4421078"></script><noscript><a href="http://top100.rambler.ru/navi/4421078/"><img src="http://counter.rambler.ru/top100.cnt?4421078" alt="Rambler's Top100" border="0" /></a></noscript><!-- end of Top100 code --> <!-- Rating@Mail.ru logo --><a href="http://top.mail.ru/jump?from=2771881"><img style="border: 0;" src="//top-fwz1.mail.ru/counter?id=2771881;t=476;l=1" alt="Рейтинг@Mail.ru" width="88" height="31" /></a><!-- //Rating@Mail.ru logo --> <!--LiveInternet logo--><a href="//www.liveinternet.ru/click" target="_blank" rel="noopener"><img title="LiveInternet" src="//counter.yadro.ru/logo?58.1" alt="" width="88" height="31" border="0" /></a><!--/LiveInternet-->
Смотрим визуально - как выглядит страница со счётчиками - вроде "не страшно" - для начала сойдёт. Так пока и оставляем. На всякий случай проверяем, не накосячили ли мы с кодом страницы - всё тем же валидатором (http://validator.w3.org/).
Работает на Nirvana WordPress. как убрать эту запись из футера? все что пишут в интернете-не получается, надписи вордпресс в коде нет!
Надпись в футере выводится через cryout_footer_hook() (\themes\nirvana\footer.php), а сам код текста генерируется функцией nirvana_site_info() в файле темы \themes\nirvana\includes\theme-functions.php
Править код прямо в этом файле - нехорошо (изменения затрутся при последующем обновлении файлов темы nirvana, если о них забыть).
Надо в папку дочерней темы скопировать файл functions.php из папки родительской темы \themes\nirvana\
и в конец этого файла добавить такую строку:
remove_action('cryout_footer_hook','nirvana_site_info',15);
- которая отменит вывод лишнего текста "Powered by nirvana", WordPress и связанных с ними ссылок.