Устанавливаем счетчик посещаемости на WordPress и красиво затемняем его

Наверное на 99% сайтах установлены счетчики. В этой статье я Вам расскажу, как установить счетчик посещаемости на WordPres и красиво его затемнить, чтобы он не бросался сильно в глаза.

.
Счетчиков существует очень много. Самым объективным и информативным, по моему мнению, является LiveInternet, который показывает очень подробную статистику по всему сайту (круче только Google Analytics). Необязательно ограничиваться только одним счетчиком, так как у других есть свои плюсы. Например, счетчик от рамблера дает индексируемую ссылку из Рамблер ТОП100. Но много счетчиков устанавливать не нужно, так как такое их скопление очень портит вид сайта.

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

.
Каждый счетчик добавляет одну внешнюю ссылку на свой сайт, но от этого неприятного факта тоже можно избавиться, добавив в код атрибут rel=»nofollow».

.

Код счетчика от Рамблера у меня выглядит так:

 

1.<!-- begin of Top100 code -->
2.<span class="counter_div">
3.<a rel="nofollow"href="http://top100.rambler.ru/navi/2405589/">
4.<img src="http://counter.rambler.ru/top100.cnt?2405589"border="0" alt="Rambler's Top100" />
5.</a>
6.<!-- end of Top100 code -->
.

А код счетчика LiveInternet выглядит так (обратите внимание, что тут нужно использовать одинарные кавычки, в противном случае ничего работать не будет):

.

1.<!--LiveInternet counter--><script type="text/javascript">// < ![CDATA[
2.document.write("<a rel='nofollow' href='http://www.liveinternet.ru/click' ""target=_blank><img src='//counter.yadro.ru/hit?t14.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"":";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,80))+";"+Math.random()+"' alt='' title='LiveInternet: показано число просмотров за 24"" часа, посетителей за 24 часа и за сегодня' "+"border='0' width='88' height='31'/>< \/a>")
3.// ]]></script><!--/LiveInternet-->

Счетчики мы установили, теперь приступим к их стилизации. Я предлагаю Вам немного затемнить счетчики, чтобы они не бросались в глаза, но при наведении на них становились яркими. Для этого необходимо наши счетчики заключить в теги:

<span class=»counter»> Здесь нужно разместить счетчики </span>

.

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

1..countera img { opacity:0.3/* CSS3 – Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9 */-moz-opacity:0.3/* Mozilla 1.6 */filter:alpha(opacity=40); /* IE 5.5+*/}

2..countera:hover img { opacity:1.0; -moz-opacity:1.0; filter:alpha(opacity=100); }

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

.

 

{lang: 'ru'}
Комментарии и пинги к записи запрещены.

Комментарии закрыты.

|
ЧИТАТЬ БЛОГ / ПОСЛЕДНИЕ НОВОСТИ - 1.. 2.. 3.. 4..
© 2011-2014 Reall-Rabota.ru / Seo-блог Алексея Анисимова. Все права защищены.
Полное или частичное использование материалов без согласия автора и прямой индексируемой гиперссылки на сайт Reall-Rabota.ru запрещено.

Яндекс.Метрика