Новое в блоге
Loading...
24 мар. 2012 г.

Счётчик просмотра статей (постов) для Blogger

Привет дорогие друзья! Прошу извенить меня за то, что так долго не обновлял свой замечательный (шутка) блог. Зато сегодня я Вам покажу несколько вариантов установки счётчика просмотров сообщений (постов, статей). Каждый может выбрать счётчик на своё усмотрение. Единственным правообладателем этого скрипта является aldous. По многочисленным просьбам посетителей - как установить счётчик просмотров постов как у меня, вот я и решил позаимствовать его у aldous. Вы можете посмотреть оригинал и познакомится с его прекрасным блогом - Blogger не для чайников. Вот вроде вступление написал (за долгое отсутствие почти разучился сочинять, прошу простить меня, постараюсь исправиться в дальнейшем). И так начнём с самого простого счётчика просмотров постов.
Счётчик с картинкой и без
И так как обычно идём Шаблон -- Изменить HTML с помощью сочетания клавиш (Ctrl+F) находим строчку data:post.body  Ставим до или после (смотря, где нужен счётчик: вверху или внизу) следующий код.

С картинкой:
<!--blogger post counter-->
<b:if cond='data:blog.pageType == &quot;item&quot;'><div align='center' style='border:solid 1px #999999; padding:2px; margin:2px; width:100px; display:compact'><img height='16' src='http://blogabloger.ru/images/stats.gif' width='16'/> <a href='#'><b><font size='2'><script src='http://blogabloger.ru/counter.php' type='text/javascript'/> Просмотров</font></b></a></div></b:if>
<!--end-->
Без картинки:
<!--blogger post counter-->
<b:if cond='data:blog.pageType == &quot;item&quot;'><div align='center' style='border:solid 1px #999999; padding:2px; margin:2px; width:100px; display:compact'><a href='#'><b><font size='2'><script src='http://blogabloger.ru/counter.php' type='text/javascript'/> Просмотров</font></b></a></div></b:if>
<!--end-->
Теперь немного пояснения:

Код b:if cond='data:blog.pageType == "item"' - заставляет отображаться только на странице поста.
Код border:solid 1px #999999 - толщина и цвет рамки.

А теперь рассмотрим, как же можно изменить внешний вид счётчика.
Попробуем сменить шрифт.Идём на Google Web Fonts, выбираем шрифт и получаем ссылку + код для css.

Ссылка на веб-шрифт:
<link href="http://fonts.googleapis.com/css?family=Lobster&amp;subset=cyrillic,latin,cyrillic-ext" rel="stylesheet" type="text/css"></link>

Запись о шрифте для стилей:
font-family: 'Lobster', cursive;
Теперь установим счётчик, вот такой получится по умолчанию:

1) Ссылка на шрифт (ставится в <head></head>):

2) Стили счётчика (ставится в css часть шаблона; перед ]]></b:skin>)

Код стиля такой:
.zebra{
font-family: 'Lobster', cursive;
color:#ff0000;
text-align: center;
border:solid 1px #999999;
padding:12px;
margin:12px;
width:100px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
-moz-box-shadow: 0 2px 10px #999999;
-webkit-box-shadow: 0 2px 8px #999999;
box-shadow: 0 2px 8px #000000;
Сам код счётчика такой:
<div style="color:red; padding:2px; margin:2px; width:100px; display:compact;"><img height='16' src='http://2.bp.blogspot.com/-GtFBeZjSyT8/Tqcov3KtjRI/AAAAAAAAGkI/lRHWwed10vw/s1600/eye.png' width='16'/>+<font size='3'><script src='http://blogabloger.ru/counter.php' type='text/javascript'/></script></font></div>
Теперь рассмотрим другой улучшенный вариант:
Установка в шаблон блога по той же схеме.

Готовый код такой:
<!--blogger post counter-->
<b:if cond='data:blog.pageType == &quot;item&quot;'><div style="color:red; padding:2px; margin:2px; width:100px; display:compact;"><img height='16' src='http://2.bp.blogspot.com/-GtFBeZjSyT8/Tqcov3KtjRI/AAAAAAAAGkI/lRHWwed10vw/s1600/eye.png' width='16'/>+<font size='2'><script src='http://blogabloger.ru/counter.php' type='text/javascript'/></script></font></div></b:if>
<!--end-->
Можно установить этот код-
ПОСЛЕ ЭТИХ СТРОЧЕК НА ВЫБОР ГДЕ ХОТИТЕ ЧТО БЫ СТОЯЛ СЧЁТЧИК:

 Перед "Автором":
<b:if cond='data:top.showAuthor'>

Перед отметкой времени:
<b:if cond='data:top.showTimestamp'>


Перед ярлыками:
<b:if cond='data:post.labels'>

Вот вроде и всё. За разъяснениями прошу обращаться в комментариях. Всего доброго. До новых встреч.

Ух ты кнопочки! Понравилась статья? Поделитесь с друзьями:

16 коммент. :

  1. СПАСИБО!!! Воспользовался =)

    ОтветитьУдалить
  2. Пожалуйста.Всё получилось?

    ОтветитьУдалить
  3. Спасибо! А как сделать чтобы на главной странице у каждого поста отображался? Как смысл счётчика если его не видно? (На главной странице)

    ОтветитьУдалить
  4. Можно попробовать удалить из кода вот это:   здесь код может получиться.

    ОтветитьУдалить
  5. блин вообще не понял)) у меня проблема сразу же на первом шагу возникает, а именно поиск /data:post.body. У меня такого нет, у меня только без этой палочки. Вот фото, чтоб вы увидели http://s48.radikal.ru/i119/1207/6e/c8260f4ef19b.jpg . Вы специалист в этом деле, мне необходимо количество просмотров на каждом посте ( глаз с плюсиком этот). Вы мне помогали и не раз, надеюсь сейчас тоже поможете). Спасибо (извините за красный, так получилось)

    ОтветитьУдалить
  6. ты знаешь..перерыл весь Гуглнет, такие же счётчики у них не работали..а у тебя да! спасибо!

    ОтветитьУдалить
  7. Сергей, к сожалению, проблема возникает на первом шагу, когда надо найти /data:post.body(( У меня только находит data:post.body без слэша этого, и причём этих data:post.body у меня много. Вот скрин сделал : http://s48.radikal.ru/i119/1207/6e/c8260f4ef19b.jpg помогите умоляю, хочу глазки установить возле каждого поста. Я знаю вы справитесь, спасибо)) Жду вашего ответа)

    ОтветитьУдалить
  8. Пожалуйста.Приятно слышать.

    ОтветитьУдалить
  9. Пожалуйста, Сергей, просмотрите мой верхний пост. Мне бы очень хотелось на свой сайт поставить этот счётчик((

    ОтветитьУдалить
  10. А Вы пробовали вставлять по очереди если их много?Я сам ставил некоторые виджеты также.

    ОтветитьУдалить
  11. Не работает Счётчик , НЕ показывает просмотры, хз почему! Если сможешь помоги! http://group-wtf.blogspot.com - мой блог

    ОтветитьУдалить
  12. Это сбои на хостинге,у правообладателя.Уверен скоро он всё исправит.

    ОтветитьУдалить
  13. Счетчик при вставке data:post.body до или после этой строчки не появляется

    ОтветитьУдалить
  14. Этот код давно уже не работает! Есть намного простое решение подсчета просмотров страниц (постов, сообщений) на своем Blogger.
    Вот как сделал это я на своем блоге на http://www.fazamaka.com/

    ОтветитьУдалить

 
Footer