Рейтинг-виджет от Graddit

2011-11-11
    Инструкция для пользователей Tumblr здесь.

    Graddit представляет рейтинг-виджет, который вы легко сможете добавить на страницы своего сайта. Код виджета можно получить на странице рейтингов. У рейтингов гибкие настройки, но обо всём по порядку.

    На странице выбора виджета для демонстрации возможностей есть несколько рейтингов с предустановленными настройками, код которых вы сможете тут же скопировать и использовать в блоге. Среди них: рейтинги со звёздами в виде картинкок, рейтнги с символьными звёздами и просто с произвольными символами, рейтинги с отзывами, рейтинги вида +/-. Код специально подготовлен для использования в шаблонах Blogger, но есть и код в "сыром" виде:


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

<div id='rate' class='rate'>{[["&#9734;","&#9733;"]]}</div>

Этот элемент div содердит информацию о символах, которые будут использованы при отображении рейтинга: "&#9734;" соответствует незакрашенной звезде, "&#9733;" — закрашенной. id элемента важен, он передаётся на сервер (см. ниже).

<div id='stats'></div>

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

<script type='text/javascript' src='http://www.graddit.com/rate/ rus/ 5/mjov07w?id=rate&stats=stats'></script>
обязательная часть, которую не стоит менять язык: rus или eng количество звёзд уникальный идентификатор рейтинга id элемента, куда будет помещён рейтинг id элемента, куда будет помещён текст (количество голосов)

Конечно, это не все возможные параметры. О некоторых речь пойдёт ниже, о других читайте следующие посты. Всё это касается внешнего вида и некоторых аспектов поведения виджета, но если вы хотите всё кардинально изменить, то специально для этого есть ещё один параметр: ...&callback=my_function_name

В этом случае после отображения рейтинга будет вызвана ваша JS функция my_function_name со следующими параметрами:
"key"уникальный идентификатор рейтинга
"id"id элемента div, в который будет помещён виджет
"stats"id элемента div, в который будет помещён текст (количество голосов)
"average"средний рейтинг
"amount"количество звёзд
"votes"количество голосов
"data"расшифровка голосов
"views"количество просмотров

Таким образом, вы обладаете полным контролем над виджетом.


Как добавить рейтинг-виджет в Blogger
  1. Выберите виджет, позже вам нужно будет скопировать код из закладки Blogger.
  2. В настройках блога перейдите на закладку Дизайн в старом интерфейсе Blogger; в новом интерфесе это пункт Template. Сохраните старый шаблон (кнопка Backup/Restore). Нажмите "Изменить HTML" и поставьте галочку напротив "Расширить шаблоны виджета":
    Старый интерфейс BloggerНовый интерфейс
  3. Сделать резервную копию шаблона можно и сейчас — просто выделите весь текст шаблона, скопируйте и сохраните в файле. В коде шаблона найдите строку "<data:post.body/>" и вставьте после неё код виджета. Если строка "<data:post.body/>" присутствует больше, чем в одном месте, и вы не уверены, куда именно вставить код виджета, то можно поэкспериментировать: вставить, например, "!!!", сохранить шаблон и проверить, угадали вы с местом или нет. Чтобы рейтинг отделить от текста парой пустых строк, вставьте перед ним <br/><br/>. Получится что-то вроде:
  4. В секцию <head>...</head> вашей страницы добавьте стили graddit:
    <link type="text/css" rel="stylesheet" href="http://static.graddit.com/css/graddit.css" />
  5. Сохраните шаблон и убедитесь, что рейтинг появился под всеми вашими постами. Если вы не хотите, чтобы рейтинг был виден на главной странице блога, а появлялся только при открытии постов, в коде виджета замените
    "<b:if cond='data:blog.pageType != &quot;static_page&quot;'>"
    на
    "<b:if cond='data:blog.pageType == &quot;item&quot;'>"

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

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

    Ещё немного про поведение виджета. Наведя (и подержав пару секунд) курсор мыши на виджет можно получить расшифровку голосов:

Это можно отключить — удалите параметры ...&info= и ...&info_delay= из кода виджета. Вы можете контролировать время задержки появления расшифровки при помощи параметра info_delay, значение которого — количество секунд, до появления информации. Вы можете полностью контролировать всплывающее окно при помощи стилей, в т.ч. удалять нежелательные элементы. Для этого, правда, придётся где-то разместить аналог файла graddit.css и поддерживать его самостоятельно.



Ниже — наглядный пример, как это будет выглядеть в блоге.
И ещё один пример здесь: http://blogger.omg-linux.ru/2011/11/reitingi-dlya-bloga.html
Рейтинг-виджет от Graddit, 4.72 out of 5 based on 50 ratings

Оцени и поделись
{[['']]}


Ещё больше полезного:

125 комментариев:

  1. А можно с микроформатами? Или Гугл не будет подхватывать?

    Звёзды, рядом количество голосов

        <div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating">
          <meta itemprop="worstRating" content = "1"/>
          <meta itemprop="ratingValue" content = "4">
          <meta itemprop="bestRating" content = "5">
    код звёзд количество голосов
        </div>

    Как правило, чем проще, тем лучше.

    ОтветитьУдалить
    Ответы
    1. Я подумаю над урощением формата, но чуть позже. Сейчас надо с личным кабинетом разобраться.

      Удалить
  2. Этот комментарий был удален автором.

    ОтветитьУдалить
  3. Хочу на одной странице разместить несколько таких рейтингов, как это сделать?

    ОтветитьУдалить
    Ответы
    1. Нужно код виджета вставить на страницу несколько раз, каждый раз меняя ID рейтинга. Если ID самому придумывать лень, то можно 3 раза обновить страницу http://graddit.com, каждый раз копируя код виджета. Не забудьте про стили.

      Удалить
  4. Подскажите!
    в двух последних постах не отображаются звезды, что делать?

    ОтветитьУдалить
  5. да, звезд нет...только надпись "Нравится пост?"...

    ОтветитьУдалить
  6. Да, почему то при добавлении новых постов звезды исчезли. Это исправят?

    ОтветитьУдалить
  7. аааааа!
    не могу понять, где этот хед найти!
    и при наведении мышкой у меня не видно рейтинга(((
    я тупая?

    ОтветитьУдалить
    Ответы
    1. Откройте редактирование шаблона, как описано в пункте 2, секция head будет вверху. Если при наведении вы не видите рейтингов, то это, скорее всего, значит, что вы не подключили стили, и рейтинги на самом деле отображаются, но не под курсором, а в левом нижнем углу страницы. Вобщем, вставите стили в head и всё заработает.

      Удалить
  8. и еще. почему у меня теперь, когда я даю ссылку на свой блог, то картинкой проявляется звездочка из шкалы "нравится" блога? мне нравится. только почему теперь она?

    ОтветитьУдалить
    Ответы
    1. Я не вполне понимаю, где появляется картинка при передаче ссылки. Если это какой-то сервис (куда вы вставляете ссылку на блог), то, возможно, он извлекает картинку из html страницы и берёт первую попавшуюся. Дайте больше подробностей или скриншот, тогда можно будет что-то внятное сказать.

      Удалить
  9. vstavliaiu kod 2 raza na strnitsu, perviy reiting viden vtarova net, ID meneaiu, ne pomogaet. Kak delat podskajite pojalusta

    ОтветитьУдалить
    Ответы
    1. Зависит от целей. Я так понимаю, вы хотите показать два разных (независимых) рейтинга. Должны отличаться не только ID рейтингов, но и id div-ов контейнеров - параметр ...id=rate... в коде вызова виджета. Т.е. у вас на странице должно быть что-то вроде:
      <div id="rate-1">вызов виджета с id=rate-1</div>, а потом
      <div id="rate-2">вызов виджета с id=rate-2</div>.
      Если не понятно, то дайте пример страницы, где вы пытаетесь это сделать и я подскажу более конкретно.

      Если же речь идёт об отображении одного и того же рейтинга в двух местах на одной странице, то тут несколько иная история, могу написать и про это подробнее.

      Удалить
  10. А как возможно ли такой рейтинг поставить на wordpress (для каждой записи свой)?
    А то ставится только общий для всех...

    ОтветитьУдалить
    Ответы
    1. Уверен, что можно, но с вордпрессом детально не разбирался пока. В планах у меня разобраться и написать инструкции для вордпресса, друпала и для кое-чего ещё. Если хотите разобраться самостоятельно, то вот подсказка: при вызове виджет должен получить уникальный идентификатор рейтинга. Если в шаблонах вашего сайта у вас такой идентификатор есть, то его и нужно передать (желательно дополнив адресом сайта или чем-то, что даст 100% гарантию, что ни у кого другого такого идентификатора не будет). Как-то так:
      ...<script src='http://graddit.com/rate/rus/5/myblogdomain_<?php $post->ID;?>?id=rate_<?php $post->ID;?>&...' type='text/javascript'/>

      Удалить
    2. Этот комментарий был удален автором.

      Удалить
    3. Спасибо, оказывается всё так просто))
      Только заменил < ?php $post->ID;? > на < ?php the_ID(); ? >

      код получился такой:

      < div id='rate' class='ffbs_rate' > {[['< img src="http://img.graddit.com/img/star.png"/ >']]}
      < div id='stats' class='ffbs_stats' >
      < script type='text/javascript' src='http://graddit.com/rate/rus/5/domain-name_< ?php the_ID(); ? >?id=rate&stats=stats&class_star=ffbs_star_img&class_star_set=ffbs_star_img_set&class_star_vote=ffbs_star_img_vote&views=yes&info=info&info_delay=2' >

      Протестил на локальном вордпрессе - вроде работает, теперь буду делать уже на сайте.

      Удалить
    4. Отлично. Только помните, что если вы хотите отображать несколько рейтингов на одной и той же странице (например, если это блог и на главной выводится несколько постов и у всех у них есть рейтинг), то rate (id div-а и параметр при вызове) и stats должны превратиться соответственно в rate_<?php the_ID(); ?> и stats_<?php the_ID(); ?>, т.е. быть уникальными для каждого рейтинга, иначе виджет просто не отрисуется в нужном месте. Можно, правда, просто исключить передачу параметров id= и stats= при вызове виджета, тогда он не будет искать свой div, а просто отрисуется в месте вызова, но это уже недокументированные возможности ;)

      Удалить
  11. Спасибо, все получилось.

    ОтветитьУдалить
  12. Здравствуйте. Не подскажите как например сделать чтобы звезды отображались не в левом нижнем углу новости, а в правом или по середине новости в нижнем углу? Спасибо.

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

    Например, для расположение в правом углу:
    <div style='display: block; width: 100%; text-align: right;'>...тут код виджета...</div>

    по центру:
    <div style='display: block; width: 100%; text-align: center; margin: 0 auto;'>...тут код виджета...</div>

    или просто
    <center></center>

    Как-то так.

    ОтветитьУдалить
  14. доброе время суток! у меня такая проблема код вставил все ок, только он(рейтинг)отображается не в каждом посту, а только в самом верхнем, и если я добавляю новою статтю то рейтинг появляется в ней а в предыдущей исчезает, что я не так делаю?

    ОтветитьУдалить
    Ответы
    1. Вероятно, вставили не в то место шаблона. Попробуйте найти все data:post.body и добавить рядом что-нибудь безобидное, например !-1-!, !-2-! и т.д. Проверьте, какое место верное и работает как вам нужно. Туда и добавляйте код виджета. Шаблон стандартный?

      Удалить
  15. Скажите как решить данную проблему...в хроме и опера все отлично работает - звезды видны, а вот в IE 7 ничего не отображается..стиль добавлял после HEAD. Заметил вот такую петрушку, если добавляю сверху такую строчку над стилями meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/ то рейтинг становится виден...но рушится меню и кнопка ДАЛЕЕ...
    Если её убираю то рейтинг исчезает..Можете помочь?

    ОтветитьУдалить
    Ответы
    1. Уверен, что дело не в стилях. Вероятнее всего причина кроется в том, как IE обрабатывает документ и скрипты в процессе загрузки страницы. Проверил ваш блог в IE, звёзды иногда отображаются, но чаще всего выдают ошибку при отработке скрипта. Я посмотрю, как это можно решить. Скорее всего сделаю загрузку виджета с отсрочкой выполнения. И один вопрос: у вас прям нативный IE7 или какой-нибудь IE9 в режиме совместимости с IE7?

      Удалить
    2. Спасибо большое, что пытаетесь мне помочь....я конешно ошибся c IE....проверял на IE 9....

      Удалить
  16. Здравствуйте!Ваш блог очень полезен! я многое у Вас извлек ОГРОМНОЕ СПАСИБО!, мой блог посвящен статуса для соц сетей,категории(разделы) статусов например "статусы про девушек" хочу сделать в каждом отдельном посте и вот в каждом посте будут написаны непосредственно сами статусы(цитаты),ВОПРОС: как в этом посте под каждым статусом поставить Ваш рейтин и в томже посте прикрутить какую нить кнопку или что то в этом роде что бы иметь возможность сортировать статусы по рейтингу для данной категории?
    с ув.Василий
    Заранее благодарен за ответ

    ОтветитьУдалить
    Ответы
    1. Есои я верно понимаю принципы работы движка Blogger, то сортировку постов на нём сделать очень и очень сложно, тем более, что сортировать вы хотите по внешним (по отношению к блогспоту) данным. Максимум, что можно сделать на данный момент, это вывести топ лучших постов, но он не будет учитывать категории. Кстати, спасибо за идёю, я, пожалуй, в настройках топов сделаю возможность фильтрации по меткам, что будет почти равнозначно выводу топов по категориям. С другой стороны, при помощи callback функции для виджета топов теоретически можно загружать полные тексты постов и формирвать из них списки, но это будет совершенно неуниверсальное решение, потому что, во-первых, его придётся модифицировать под разметку конкретного блога, и, во-вторых, такие списки не будут индексирваться поисковиками. Но идея годная, поставлю себе на заметку. Для быстрого и удобного решения задачи я вам рекомендую воспользоваться какой-нибудь CMS с более богатыми возможностями, например, Drupal. Там уж точно можно и категории задавать и по рейтингам сортировать.

      Удалить
  17. Хотя, вот сейчас написал комментарий, и появилась у меня одна идея, как можно провернуть сортировку постов в блоггере. Но на реализацию потребуется время, возможно, не одна неделя. Следите за обновлениями.

    ОтветитьУдалить
  18. Очень благодарен вам за Баш ответ! буду следить за обновлениями!, переходить на новый движок- у меня мало опыта в этом деле, и это же надо будет переходить на платный хостинг на сколько я понимаю?, так что пока буду ждать Вашего ответа. Если у Вас есть идеи может ка-то сделать это ну типа что бы рейтинг и кнопки соц сетей отображались под каждым статусом без возможности сортировки, просто что бы смотрелось красиво, я сначала думал каждому статусу присвоить отдельный пост, так вроде и рейтинг нормально отображается и и кнопки соцетей нормально, но копнув дальше я понял что эти мои статусы плохо будут индексироваться так как пост будет получатся очень и очень маленьким, может есть какая нить хитрость что бы такие маленькие посты нормально индексировались или это без шансов?

    ОтветитьУдалить
    Ответы
    1. Да, хостинг будет платный. Я по вопросам индексирования совсем не специалист, почему маленькие посты могут не индексироваться для меня загадка. Были случаи?

      Удалить
  19. Добрый день!
    Я ищу такие же виджиты, но для использования в текста поста. Представляемые Вами годятся? И каким в таком случае будет порядок установки? |Спасибо|

    ОтветитьУдалить
    Ответы
    1. В текст поста можно вставлять код виджета из закладки "Generic" (Общий) со страницы http://www.graddit.com/ratings-widget. Для каждого нового виджета вам нужно будет обновлять страницу, чтобы менялся идентификационный номер рейтинга (ну или выдумывать его самому по типу myblog_rating_1, myblog_rating_2, и так далее. Под номером рейтинга я имею в виду то, что ниже выделено жирным шрифтом:
      <div id='rate_ltoce7d' class='ffbs_rate'>
      <!--{[['<img src="http://static.graddit.com/img/star.png"/>']]}--></div>
      <div id='stats_ltoce7d' class='ffbs_stats'></div>
      <script type='text/javascript' src='http://www.graddit.com/rate/eng/5/ltoce7d?id=rate_ltoce7d&stats=stats_ltoce7d&info=info&info_delay=2&class_star=ffbs_star_img&class_star_set=ffbs_star_img_set&class_star_vote=ffbs_star_img_vote&views=yes&votes=yes&average=yes'></script>

      Удалить
  20. плин, поменяла шаблон в блоге, виждет стал отображать звёзды вертикально, пробовала стирать всё и устанавливать заново виджет, но все равно одно и то же.. в чём дело тут? в кривых руках или настройках вашего CSS?

    ОтветитьУдалить
    Ответы
    1. Стили конфликтуют со стилями блога. Дело в этом куске вашего css:
      .widget img {
      display: block;
      }

      т.е. любое изображение под элементом с классом "widget" будет занимать всю доступную ширину, соответственно, если изображений 5 подряд, то они отобразятся в столбик. Можно поменять на inline-block и посмотреть, как это повлияет на другие виджеты. Либо вынести рейтинги из контейнера с классом "widget".

      Удалить
    2. Отлично! спасибо - исправила на инлайн и все встало на свои места.. остальные виджеты по-моему в порядке

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

    ОтветитьУдалить
    Ответы
    1. Что конкретно не получается? Шаблонизатор выдаёт ошибку при сохранении? Всё сохраняется, но в результате ничего не видно на страницах?

      Удалить
    2. Да всё сохранено, но ничего не видно. Сначала я думала это из-за браузера, но попробовала и ОПЕРУ И ЭКСПЛОВЕР И ЛИСУ результат нулевой, что делать???

      Удалить
    3. Речь идёт о http://vojtiko.blogspot.com? Ничего не вижу в исходном коде страницы. Если вы ничего не удаляли, то, значит, код был добавлен в неверное место. Часто в шаблоне есть несколько похожих мест, не все из них подходят для виджета. Тот же data:post.body/ может присутствовать более одного раза. Чтобы найти верное место, попробуйте сначала какой-нибудь безобидный код добавить во все такие места (я использую !-1-!, !-2-!, и т.д.). Какая цифра появилась, вместо той и ставить код виджета. И не забудьте css добавить в head, сейчас его тоже нет.

      Удалить
  22. К сожалению я уже все удалила, поэтому Вы ничего не увидели. Сегодня вечером все восстановлю, а Вы плиз посмотрите завтра и ответьте если не трудно. В шаблоне я нашла 3 места где присутствует сочетание data:post.body/ и добавляла код после 3-его, может эта и есть проблема. Спасибо попробую сначала с безобидным кодом.

    ОтветитьУдалить
  23. Ура все получилось, фишка была в самом простом, я забыла выбрать платформу и скопировала общий код доступа, да и "на старуху бывает проруха". Вот только не знаю как поменять цвет шрифта перед рейтингом Оцените эту ИСТОРиЮ, помогите, подскажите плиз.

    ОтветитьУдалить
    Ответы
    1. > как поменять цвет шрифта перед рейтингом Оцените эту ИСТОРиЮ
      Как и любого другого текста в вашем шаблоне: заключив текст в <span>...</span> и либо прописав инлайн стили, либо нужный класс. Например так:
      ...<span style="color: red;">Оцените эту ИСТОРиЮ</span>...

      Удалить
  24. За вашу статью поставила Вам 5 звезд. Спасибо!

    ОтветитьУдалить
  25. Простите у меня опять вопрос, решила сменить рейтинг на Да/Нет с картинками, ? Почему идет отображение 5 картинок ДА НЕТ ДА НЕТ ДА Вот такая последовательность, как сделать так чтобы было ДА НЕТ Вроде 5 я нигде не нашла.

    ОтветитьУдалить
    Ответы
    1. Потому что изначально они были пятизвёздочными, для всех уже существующих постов эта информация была сохранена при первом показе виджета и изменить её нельзя. Но решение есть, даже два:
      - если вам не нужна статистика по старым голосам, то можно удалить рейтинги, для этого зайдите в административный интерфейс (сгенерируйте ключ, если не сделали этого раньше), закладка Статистика, удалите рейтинги при помощи значка ☠, ваш новый виджет должен начать работать правильно;
      - если статистика нужна, то придётся изменить код виджета, дописав к id рейтинга какой-нибудь префикс, например new_, т.е. сделать примерно так:
      ..com/rate/eng/2/new_&quot; + data:post.id + &quot;?...

      Удалить
  26. Здравствуйте! Шаблон поставился и работает прекрасно, вот только как мне его сместить так чтобы он у меня был в правом нижнем углу под виджет LinkWithin? dissonanceflavor.blogspot.ru
    Спасибо!

    ОтветитьУдалить
    Ответы
    1. Для этого код виджета в шаблоне надо ставить под кодом LinkWithin и прописывать стили родительского элемента так, чтобы он был смещён вправо.

      Удалить
  27. Здравствуйте! Скажите, почему звезды пропадают каждые пол часа?

    ОтветитьУдалить
    Ответы
    1. Была проблема, но сейчас всё должно работать. Какой адрес у блога?

      Удалить
    2. звезды работают когда работает graddit.com, каждые пол часа на сайте сообщение "Веб-страница недоступна
      Подключение к www.graddit.com прервано." или "502 Bad Gateway". Можно как то купить ваши звезды, что бы залить на свой хостинг? :)

      Удалить
    3. > каждые пол часа на сайте сообщение
      я проверю, что может быть не так и что можно сделать

      > Можно как то купить ваши звезды, что бы залить на свой хостинг
      сейчас нет, но идея хорошая, я подумаю, какую часть системы и на каких условиях можно было бы продавать.

      Удалить
    4. Спасибо за ответ! Будем ждать

      Удалить
  28. С недавнего времени вместо надписи о количестве проголосовавших появились кракозябры вида 1 голос
    Из-за чего это может быть?

    ОтветитьУдалить
    Ответы
    1. Либо кодировка вашего блога не utf-8 (что странно), либо у браузера проблемы с определением кодировки, либо вы используете data-атрибуты для перевода, где помещаете текст не в той кодировке. Мне недавно сообщали о похожей проблеме в Windows XP, тогда у пользователя было что-то неверно настроено с отображением шрифтов. Ссылка на блог помогла бы сузить круг возможных проблем.

      Удалить
    2. Да, действительно, кодировка на сайте была windows-1251. Сейчас изменил на utf-8 и все стало нормально. Спасибо. Но ведь до недавнего времени почему-то и с этой кодировкой всё работало!)

      Удалить
    3. Неожиданно возникли проблемы с перекодировкой сайта. А при кодировке win-1251 нельзя ничего сделать, чтобы рейтинг нормально отображался?

      Удалить
    4. Можно попробовать, следуя инструкции http://fruitfulbookmarks-ru.blogspot.com/2012/06/graddit.html, в data-атрибутах поставить текст в кодировке cp-1251. Не знаю, поможет или нет. А можно вообще весь текст убрать, оставив только звёзды. Для этого нужно в коде вызова указать ...votes=no&views=no&average=no...

      Удалить
    5. Спасибо. Выбрал пока промежуточное решение, поменял параметр rus на eng.

      Удалить
  29. Доброго времени суток!
    Постигла аналогичная проблема как и у "al kout"...
    После установки рейтинга-на сайте крокозябры (оценка: 0 | 0 голосов | 2 просмотра)
    Копирую код отсюда: http://fruitfulbookmarks-ru.blogspot.com/2012/06/graddit.html
    --Рушится дизайн!

    Двиг самописный php...

    Очень прошу помочь решить поблему!

    ...И ещё,вопрос был задан в самом начале:

    "NMitra1 марта 2012 г., 23:05
    А можно с микроформатами? Или Гугл не будет подхватывать?
    Звёзды, рядом количество голосов
    Как правило, чем проще, тем лучше."

    ...Как всё-таки по поводу структурированных данных,"Гугл будет подхватывать?"

    Очень надеюсь на скорый ответ!
    Спасибо.


    ОтветитьУдалить
    Ответы
    1. Кракозябры - это несовпадение кодировок. Весь русский текст в рейтингах отображается в кодировке utf-8, решение тоже, что и в ветке выше.

      Микроформаты. Сейчас есть в экспериментальном виде, только для блогов на blogspot и только для подписчиков. Например, если адрес этой страницы ввести в гугле, то в выдаче появится сниппет со звёздочками. Для самописного движка вам нужно будет самостоятельно получать данные о голосах и формировать сниппет. Правда, простого способа получить эти данные сейчас нет, но я его сделаю, раз есть необходимость.

      Удалить
  30. ...И ещё,почему так долго подгружается скрипт?

    Извиняюсь,что много вопросов...

    ОтветитьУдалить
    Ответы
    1. Ещё раз прошу прощения,НО теперь возник главный вопрос:
      КАК вывести кол-во голосов переменной,без этого:
       (
      1
      votes
      )
      Нужно просто число...

      Снипет гугла не видит зашифрованный рейтинг!...

      Или нужно искать другой скрипт рейтинга?

      Удалить
    2. Была проблема с одним из серверов.

      Удалить
    3. Сниппет гугла ничего не будет видеть, потому что рейтинг формируется динамически прямо на странице. У меня есть решение для блогов на blogspot и скоро я его представлю.

      Удалить
  31. > КАК вывести кол-во голосов переменной,без этого
    Попробуйте это http://fruitfulbookmarks-ru.blogspot.com/2012/06/graddit.html

    ОтветитьУдалить
  32. "> КАК вывести кол-во голосов переменной,без этого
    Попробуйте это http://fruitfulbookmarks-ru.blogspot.com/2012/06/graddit.html"

    ...Большое спасибо что ответили!...

    Когда вставляю этот код,рушится диз...

    ...Понял,что никак нельзя что бы вывести примерно так < echo "@@@" >...
    Плохо,очень жаль...
    Использую caclE,очень интересная штука,думал у Вас так-же...

    ОтветитьУдалить
  33. Как сделать такой же рейтинг комментариев?

    ОтветитьУдалить
    Ответы
    1. Или чтобы писалось "Это — решение проблемы!" как здесь:
      http://muzebra.copiny.com/problem/details/id/88448#comment_179739

      Удалить
    2. Как показала практика, рейтинг комментариев - это плохая идея. Потому что, если, например, комментариев на странице 100, то и обращений к скрипту тоже 100, а это очень долго.

      "Решение проблемы" сделать можно, но надо знать JS.

      Удалить
  34. У меня кодировка "windows-1251" - она по умолчанию, менять не хочу.
    Как скорректировать код, чтобы не выходила абракадабра , типа " (оценка: 5 | 1 голос | 1 просмотр)" ?

    ОтветитьУдалить
    Ответы
    1. Этот вопрос возникал несколько раз, и с вашего позволения я бы хотел перенести обсуждение проблемы на форум поддержки виджетов Graddit, в этот раздел. Но если коротко, то посмотрите эту инструкцию: http://fruitfulbookmarks-ru.blogspot.com/2012/06/graddit.html.

      Удалить
    2. Этот комментарий был удален автором.

      Удалить
    3. Извините, что снова пишу сюда. На сайте http://bloggerprize.ru, некоторая задержка с регистрацией.

      Я прочитал страницу http://fruitfulbookmarks-ru.blogspot.ru/2012/06/graddit.html , но это видимо для какой-то базы по управлению сайтом (вордпресс, жумла или болг...). А я сайт делаю вручную.
      Подскажите пожалуйста, как изменить код со звездами, чтобы были русские слова. (код для вставки на страницу в HTML документе).

      Удалить
    4. Нет, там просто пример кода дан для Blogger, а смысл в том, что у основного элемента <div> есть несколько data-атрибутов, через которые можно контролировать текст. Это подойдёт и для сайта, сделанного вручную. Смотрите отсюда и ниже.

      Удалить
    5. Сначала не получалось. Потом просто посмотрел код страницы (http://www.fruitfulbookmarks.com/quote/179dfe07-c46e-11e2-b765-4328a77bc964), скопировал от туда и все получилось.
      Спасибо за ответ, но все же лучше написать чисто сам код для тех, кто вручную делает страницы сайта, а то для "не слишком" опытного блоггера не понятно.

      Удалить
    6. Еще один вопрос (если можно): почему-то медленновато загружаются. Если запустить страницу, то звезды задерживают загрузку страницы примерно на 5 секунд. Интернет у меня быстрый и компьютер тоже.

      Удалить
    7. Да, сейчас есть задержки - добавляю больше серверов, но не всё проходит гладко, решаю проблемы с хостерами. Чтобы страница не ожидала загрузки виджета, воспользуйтесь опцией "[x] без блокировки" (http://graddit.com/rus/ratings-widget).Чуть больше информации здесь: http://fruitfulbookmarks-ru.blogspot.com/2013/03/delayed-ratings-widget-load.html.

      Удалить
    8. Если поставить галочку, то добавляется тег "<dummy src= ...". Это наверно опять для Blogger. А как изменить для ручных страниц HTML?
      Я добавлял ("<dummy src= ...") и строку в HEAD, но вся страница перестает грузится вообще.

      Удалить
    9. Нет, это не только для Blogger, там можно выбрать платформу, вам нужен "Общий" код. Для примера можете посмотреть исходный код этой самой страницы в блоге, на которой мы общаемся - найдите тег dummy и посмотрите, как должен выглядеть код.

      Удалить
  35. Здравствуйте,подскажите пожалуйста куда вставлять CSS стили(сторчку), я понял что в "Head",но куда именно ??? Потому что у меня не работает ничего,либо видно звезду одну или сердечко только оно в скобачках и на него невозможно нажать. Заранее спасибо!

    ОтветитьУдалить
    Ответы
    1. Откройте исходный код этой страницы и найдите graddit.css. Вот туда и вставлять. Либо дайте адрес проблемной страницы, я проверю.

      Удалить
  36. А как убрать все ненужное из кода, чтобы осталось только "количество просмотров"?

    ОтветитьУдалить
    Ответы
    1. В параметрах вызова ...&views=yes&votes=no&average=no...

      Удалить
  37. Я бы хотел сделать рейтинг для отдельно взятых страниц (постов) на блогспот. Скажите это возможно?

    ОтветитьУдалить
    Ответы
    1. Возможно, выбирайте "Общий код", вставляйте в текст нужных постов. Для каждого нового поста каждый раз придётся брать новый код (обновляйте страницу).

      Удалить
  38. А можно ли как-то отключить рекламу, которая показывается при наведении на звездочки?

    ОтветитьУдалить
    Ответы
    1. Рекламу можно отключить, оформив подписку здесь: http://www.graddit.com/rus/prices - самая дешёвая 3 доллара в месяц (через paypal).

      Удалить
  39. Ясно, а еще вопросик, виджет, самый первый, который с соц кнопками идет, можно убрать эти соц кнопки? И поменять цвет звезд...

    ОтветитьУдалить
    Ответы
    1. Соцкнопки убрать можно, для этого нужно в коде вызова убрать параметр share или поставить share=no.
      Звёзды можно ставить какие угодно - в коде это просто адреса (URL) изображений, замените их на любые другие.

      Удалить
  40. И еще вопрос, можно ли к виджету добавить микроразметку, чтоб в поиске были звездочки) ??

    ОтветитьУдалить
    Ответы
    1. Если для блогов на Blogspot, то вот инструкция: http://fruitfulbookmarks-ru.blogspot.com/2013/05/rating-snippet-on-google-search-page-and-graddit-ratings.html (только для подписчиков). Для всех остальных платформ пока нет. Помните, что даже при наличии разметки Гугл не гарантирует вывод звёздочек в поиске.

      Удалить
  41. А когда сделаете снипет гугл для "общего кода", очень нужно)

    ОтветитьУдалить
    Ответы
    1. В данном случае это невозможно по техническим причинам: код рейтингов исполняется на стороне клиента (в вашем браузере), поисковые роботы вместо рейтингов видят только код вызова, который они не могут исполнить, чтобы получить сниппет. Всё что можно сделать - это подставлять код сниппета вручную, обновляя его по необходимости. То, что есть для Блогспота - это всего лишь автоматизация ручного процесса, при чём с полным доступом в чужой блог. Для общего кода такую автоматизацию нужно строить отдельно для каждого проекта.

      Но вы не переживайте, ходят упорные слухи о том, что Гугл прикрыл лавочку рейтингов в микроразметке. Косвенное подтверждение тому - постепенное исчезновение звёзд из выдачи.

      Удалить
  42. Печаль... хотя не удивительно, мне тоже все время казалось зачем эти звезды, можно же всегда настроить 5 из 5 и показывать их)

    ОтветитьУдалить
  43. А у меня почему-то отображается одинаковая статистика для всех страниц...

    ОтветитьУдалить
    Ответы
    1. Вероятно, неправильно вставили код виджета. Дайте адрес блога - проверю.

      Удалить
  44. Это портал недвижимости)
    http://linestate.ru/doc/articles/vidy-kreditov-i-bankovskie-uslugi-naseleniyu/ - Вот я в статьи вставил виджет...

    ОтветитьУдалить
  45. Я вставлял код не в каждую страницу, а в шаблон статей, может быть из-за этого..?

    ОтветитьУдалить
    Ответы
    1. Для каждого рейтинга нужно указывать уникальный номер. Это может быть номер статьи в системе управления контентом, например. Лучше его при этом дополнить префикосом домена, чтобы не было пересечений с другими сайтами. Например так:
      http://www.graddit.com/rate/rus/5/http:/linestateru_НОМЕР_СТАТЬИ?id=rate_linestateru_НОМЕР_СТАТЬИ&stats=stats_linestateru_НОМЕР_СТАТЬИ&feedback=feedback_linestateru_НОМЕР_СТАТЬИ&info=info&info_delay=2&class_star=ffbs_star_fimg&class_star_set=ffbs_star_fimg&class_star_vote=ffbs_star_fimg&average=yes&views=yes&votes=yes

      Ну и везде в коде, где есть идентификатор, его нужно заменить на ваш собственный.

      Удалить
  46. ((( после установки кода звездочки не появились (( с чего бы это? и как теперь восстановить код ?

    ОтветитьУдалить
    Ответы
    1. Возможные причины того, что звёздочки не появились:
      - не полностью скопировали код
      - скопировали код не для той платформы
      - вставили код в неправильное место в шаблоне

      Какой код и как вы сломали, что его теперь нужно восстанавливать?

      Удалить
  47. Доброго времени суток!
    Я не могу подтвердить Сгенерированный ключ. Сервис wix.com этого не позволяет! Можно как то другим путем получить ключ?

    ОтветитьУдалить
  48. Здравствуйте, возникла необъяснимая проблема, работали graddit-ские рейтинги больше месяца, а вот вчера ни с того, ни с сего прекратили отображаться, грустно, надо сказать. В чем может быть причина? Спасибо!

    ОтветитьУдалить
    Ответы
    1. http://kopilkarish.blogspot.ru/
      вот адрес на всякий случай

      Удалить
  49. Ну просто волшебник, все снова работает, 10-кратное спасибо.

    ОтветитьУдалить
  50. как брать рекламное окно в виде морды?и сильно нагружает страницы блога,дополнительный скрипт не помогает!!!

    ОтветитьУдалить
    Ответы
    1. Чтобы убрать рекламу нужно оформить подписку: http://www.graddit.com/rus/prices
      Что такое дополнительный скрипт? Асинхронный код не помогает (галочка "без блокировки" при выборе кода виджета)?

      Удалить
    2. lola l, если я правильно понял, вам нужно убрать рекламное окно, которое вылезает при наведении курсором на звезды ? Если да, то просто пропишет в стили CSS вот это и проблема решена
      div.ffbs_info {
      z-index: 0 !important;
      }
      Кто нибудь решил проблему рейтинга для blogger, с подключением микроформатов ? напишите на почту пожалуйста sitetostart@gmail.com

      Удалить
    3. Вы никак не сможете решить проблему микроформатов, вы можете только добавить их в разметку. Потом гугл сам решит, показывать её или нет, исходя из своих секретных критериев. Критерии меняются, так что сегодня микроразметка есть, а завтра её уже может не быть. И наоборот.

      Удалить
    4. Кстати, стили вам не помогут, потому что рекламу-то вы уберёте, но виджет без подписки через 2 недели просто перестанет принимать новые голоса.

      Удалить
  51. Добрый день! Спасибо за статью и сервис, все получилось, НО у меня тот же вопрос: как можно убрать рекламу gog.com, которая появляется при наведении курсора, тем более, что при переходе выдает ошибку 404. Блог не коммерческий, образовательный http://topchiyirina.blogspot.com/, была бы очень признательна, если бы Вы подсказали как решить эту проблему. С уважением, Ирина Топчий

    ОтветитьУдалить
    Ответы
    1. Здравствуйте Ирина. Рад, что вам понравился виджет. Рекламу убрал на полгода.
      В коде виджета у вас небольшая ошибка - вы удалили часть info=, хотя хвост остался. Не страшно, но при наведении не будет показываться распределение голосов (теперь уже без рекламы). Если хотите это исправить, но по какой-то причине не получается, напишите на support@graddit.com и я вам помогу.

      Всего наилучшего!

      Удалить
  52. Добрый день! Большое спасибо за столь быстрый ответ и подарок (без рекламы). Приятно удивлена, что решили помочь! Это ОЧЕНЬ впечатлило!))))))))) Когда ставила код, то и преследовала цель убрать таблицу голосов (где-то прочитала как это можно сделать, я совсем не сильна в программировании) С уважением, Ирина Топчий

    ОтветитьУдалить
  53. Этот комментарий был удален автором.

    ОтветитьУдалить
  54. Что за «секция... Где её искать?!

    ОтветитьУдалить
    Ответы
    1. Для Блоггера? В шаблоне, который нужно открыть в редакторе, встроенном в Блоггер.

      Удалить