Как вставить код счетчиков посещений на сайт под управлением Joomla через модуль Произвольный HTML-код или напрямую в шаблон

Здравствуйте, уважаемые читатели блога KtoNaNovenkogo.ru. Решил написать отдельную статью о том, как поставить счетчики посещений на сайт. Речь пойдет о LiveInternet (читайте о возможностях Лайвинтернета), ТОП Майл.ру, рейтинге HotLog и Рамблер Топ100 , OpenStat и некоторых других.

Мы будем пытаться их интегрировать в шаблон Joomla, а в следующей статье уже в WordPress и форум на SMF.

Установка счетчиков LI, Рамблер Топ 100 и других в Joomla

Перечисленные выше счетчики обладают одной общей особенностью — они имеют видимую посетителям вашего ресурса область с информацией о посещаемости вашего ресурса. В то время как Google Analytics и Яндекс.Метрика такой видимой посетителям области не имеют, поэтому их код достаточно будет установить, допустим, перед закрывающим тегом BODY в шаблоне вашего сайта.

Поправка — Метрика сейчас получила возможность вставлять информер, но эту возможность нужно будет специально активировать в настройках (см. подробнее по приведенной только что ссылке).

Код невидимых счетчиков посещений (Аналитикса и Метрики) иногда стараются разместить в конце Html кода страницы для того, чтобы он не тормозил подгрузку информационной составляющей страницы, хотя точность подсчета в этом случае будет немного ниже, чем при размещении кода в верхней области.

А вот Ливинтернет, Майл.ру, Рамблер Топ 100, ХотЛог или ОпенСтат (имеющих информер) нужно устанавливать в то место шаблона вашего сайта, где эти самые информеры будут выглядеть уместно и сочетаться с общим дизайном. Либо можно получить двухчастевой код счетчика (читайте об этом во второй части статьи по приведенной чуть выше ссылке), что даст вам определенную гибкость в его размещении.

Когда то у меня блок с информерами был вставлен в футер (нижнюю область всех станиц вашего ресурса):

Если вы еще не имели дело со счетчиками посещений, то, возможно, вам будет интересно ознакомиться с серией уроков по получению, установке, настройке и работе с ними (см. ссылки приведенные в начале этой статьи).

Будем считать, что код нужного вам информера вы получили и теперь стоит задача вставить его в шаблон вашего сайта, форума или блога. Сразу обращаю ваше внимание, что основной нашей задачей при вставке будет размещение этого кода таким образом, чтобы счетчик отображался на всех страницах вашего ресурса.

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

В случае проекта, основанного на том или ином движке (CMS — читайте обзор платных и бесплатных движков), реализовать эту задачу совсем не сложно. Дело в том, что у проектов, основанных на движке, как правило, имеется шаблон, на основании которого формируются все страницы ресурса.

Наша задача в этом случае сводится к тому, чтобы вставить код счетчиков посещаемости в то место шаблона, которое отображается на всех страницах сайта. Например, в Joomla это может быть, к примеру, модуль, в WordPress — футер, да и в SMF такое место будет найти не сложно.

Но обо всем по порядку. Давайте будем разбираться с каждым движком сайта (где скачать и как установить тот или иной движок вы можете прочитать: Joomla, WordPress, SMF) по отдельности и начнем, пожалуй, с «великой и ужасной» Джумлы.

Начнем с самого очевидного способа вставки. Он не потребует открывать на редактирование файлы шаблона. Все операции будут выполняться из админки Joomla. Код счетчика мы будем вставлять в одну из позиций для модулей (тут про модули читайте подробнее), которая предусмотрена в используемом вами шаблоне (здесь я писал про то, как устроены шаблоны в Джумле и где их можно взять бесплатно, ну, или за деньги).

Увидеть все позиции для модулей, имеющиеся именно в вашем шаблоне, вы сможете, просто добавив в конце URL вашего ресурса в адресной строке браузера ?tp=1(например, http://fdfd.ru/?tp=1). В разных шаблонах количество и расположение мест для модулей отличается. Итак, заходим в админку Джумлы, выбираем из верхнего меню «Расширения»- «Менеджер модулей».

На открывшейся странице вам нужно будет нажать на кнопку «Создать», расположенную в верхнем правом углу окна:

и выбрать из открывшегося списка модулей вариант «Произвольный HTML-код». В верхней левой части открывшегося окна в области «Подробности» вы должны будете заполнить поле «Заголовок», поставить галочку в позицию «Да» в поле «Включено», а затем выбрать из выпадающего списка в поле «Позиция» место на страницах сайта для отображения создаваемого модуля со счетчиками посещаемости.

Кроме описанного выше способа можно так же посмотреть позиции для модулей, выбрав из верхнего меню админки Joomla «Расширения»- «Менеджер шаблонов». Щелкните на открывшейся странице по названию используемого шаблона (напротив него в столбце «По умолчанию» будет стоять звездочка). Откроется страница настройки, где в верхней правой области вам нужно будет нажать на кнопку «Просмотр»:

В результате, откроется главная страница вашего проекта с выделенными и подписанными позициями для модулей. Вуаля.

Отключаем визуальный редактор в Joomla для вставки кода счетчиков

В нижней части открывшегося окна «Произвольный HTML-код» вы можете вставить полученный код счетчиков посещений (посещаемости). Но при этом не забудьте отключить визуальный редактор на время вставки этого кода. Его можно отключить в общих настройках Joomla, выбрав из верхнего меню пункт «Сайт» — «Общие настройки» и перейдя на вкладку «Сайт». В области «Установки сайта» в поле «Визуальный редактор по умолчанию» выберете из выпадающего списка вариант «No Editor»:

Если вы попытаетесь вставить код отличный от Html при включенном визуальном редакторе, то после сохранения внесенных изменений (кнопки «Сохранить» или «Применить») часть его просто исчезнет. Дело в том, что редактор обрезает все, что не является тегами и атрибутами языка гипертекстовой разметки. Если вы не хотите каждый раз отключать редактор, то можете зайти в настройки редактора TinyMCE и отключить там исправление Html кода.

После того, как вы добавите фрагмент с кодом счетчика в модуль произвольного HTML-кода, сохраните произведенные изменения и убедитесь, что на вашем ресурсе они отображаются именно так, как вы и хотели. После этого визуальные редактор можно будет опять включить (с ним все-таки удобнее работать со статьями, чем делать это в голом HTML).

Для его включения вам нужно проделать те же самые действия, что вы выполняли для его отключения, и из выпадающего списка в поле «Визуальный редактор по умолчанию» выбрать используемый вами.

Подробнее почитать про визуальный редактор, используемый для повышения удобства при написании статей, вы можете здесь — Настройка визуального редактора по умолчанию для сайта на Joomla. Кстати, вовсе и не обязательно каждый раз его отключать в общих настройках движка.

Можно создать специального пользователя с нужными правами (наверное, менеджер или администратор), в настройках которого будет отключен визуальный редактор, и когда понадобится вставить в текст статьи или в модуль какой-нибудь скрипт, то можно будет просто войти в админку под этим пользователем. Как это сделать, подробно описано по приведенной в предыдущем абзаце ссылке.

Позиционирование информеров в области отведенной модулю

Для позиционирования информеров LiveInternet, Mail.ru, HotLog, SpyLog или Rambler Top100 в области, отведенной под модуль в шаблоне Джумлы, вы можете заключить их код в открывающий и закрывающий теги DIV (создать контейнер) и прописать в открывающем теге DIV атрибут CLASS. Например:

<div class="poziciy">фрагмент</div>

а в файле CSS вашего шаблона оформления (обычно находится в папке /templates/папка_вашего_шаблона/css/) прописать для этого класса (в нашем примере — poziciy) соответствующие свойства (смотрите уроки по CSS), с помощью которых вы сможете, например, задать отступ счетчика от границ модуля или даже сделать его невидимым.

При этом, статистику этот счетчик будет продолжать исправно собирать, но посетители вашего ресурса его информер видеть не будут. Делаете, например, так:

<div id="nevidimka"> код счетчика(ов) </div>

А в вашем файле CSS прописываете для этого ID свойство:

#nevidimka {display:none;}

Про CSS свойство display читайте тут. Всё, теперь счетчик, заключенный в контейнер с id="nevidimka", исчезнет со страниц вашего ресурса.

Хочу привести пример с информером LiveInternet, в качестве иллюстрации позиционирования его изображения с помощью таблиц каскадных стилей. Как видите, картинка счетчика расположена справа, немного отодвинута от правого края, а слева от нее располагается этот текст. Для того, чтобы этого добиться, нужно было всего лишь заключить Html тег IMG, с помощью которого вставляются изображения в HTML код, в открывающий и закрывающий теги DIV с прописанным классом:

<div class="live"><img src="https://ktonanovenkogo.ru/image/logo.gif" /></div>

а в CSS файл шаблона оформления вставить свойство для этого класса:

.live {
float: right;
margin-right: 30px;
}

Строка float: right; (здесь про Float и clear в CSS читайте подробнее) задает прижатие этого контейнера к правому соседнему элементу дизайна, а строка margin-right: 30px; (а тут про отступы и рамки с помощью Padding, margin и border) задает отступ в 30 пикселей от правого края. Все довольно просто.

Вставка кода счетчиков посещений прямо в шаблон Joomla

Если вы по каким-либо причинам не хотите использовать модуль «Произвольный HTML-код» или у вас это сделать не получается, то можно добавить информер со статистикой в модуль на вашем сайте напрямую, получив доступ к серверу хостинга по FTP (здесь я писал про Файлзилу — лучший ФТП клиент).

Например, для того, чтобы вставить код счетчиков в футер (самая нижняя область на всех страницах), то вам нужно будет открыть на редактирование файл /modules/mod_footer/tmpl/default.php. Самое лучшее место для добавления информера будет после строк:

<?php // no direct access
defined('_JEXEC') or die('Restricted access'); ?>
<div><?php echo $lineone; ?></div>
<div><?php echo JText::_( 'FOOTER_LINE2' ); ?></div>

Код счетчика вы можете заключить в контейнер (тегами DIV с прописанным классом) и осуществлять его дальнейшее позиционирование и выравнивание с помощью стилей, которые вы можете дописать в файле CSS вашего шаблона оформления (обычно находится в папке /templates/папка_вашего_шаблона/css/).

Кстати говоря, именно в файле /modules/mod_footer/tmpl/default.php можно убрать строку из футера, в которой говорится, на чем он работает (Joomla! — свободное программное обеспечение, распространяемое по лицензии GNU/GPL). Для этого нужно удалить в /modules/mod_footer/tmpl/default.php строку:

<div><?php echo JText::_( 'FOOTER_LINE2' ); ?></div>