На uptolike.com зарелизили модуль рейтингов. Смысл модуля - в подсчете лайков/анлайков на манер кнопок like соц сетей. Конкурентное преимущество состоит в том, что подсчет идет на основе профиля соц сети, то есть 2 раза проголосовать не получится даже с разных браузеров.
Как и в случае с кнопками, код отдается синхронный, он вполне подходит для страницы с одной конкретной статьей, но не очень для страницы со списком статей (например главная страница сайта).
Для списка статей, как и в случае с кнопками шар, есть специальная версия кода:
Заметьте, если вы уже вставили кнопки с помощью описанного мной подхода, то пункт 1 делать не нужно, скрипт уже добавлен.
Пример div:
Параметры следующие:
Как и в случае с кнопками, код отдается синхронный, он вполне подходит для страницы с одной конкретной статьей, но не очень для страницы со списком статей (например главная страница сайта).
Для списка статей, как и в случае с кнопками шар, есть специальная версия кода:
- Вставляем скрипт
<script src='http://w.uptolike.com/widgets/v1/uptolike.js' type='text/javascript'></script>в <head> - В нужное место кода вставляем <div> с классом uptolike-rating.
Заметьте, если вы уже вставили кнопки с помощью описанного мной подхода, то пункт 1 делать не нужно, скрипт уже добавлен.
Пример div:
<div class="uptolike-rating" data-count-clicks="true"
data-icon-color="cc0000" data-icon-size="14"
data-pid="1" data-url="http://penkovvladimir.blogspot.ru/"><div>
Параметры следующие:
- data-url - адрес страницы, на которой размещена статья
- data-pid - идентификатор проекта на сайте Uptolike
- data-like-layout - порядок элементов в блоке like. 3 буквы 't' = текст, 'i' = иконка, 'c' = счетчик. Например, tic = текст-иконка-счетчик. ict=иконка-счетчик-текст. i - иконка
- data-like-layout - порядок элементов в блоке like. 3 буквы 't' = текст, 'i' = иконка, 'c' = счетчик. Например, tic = текст-иконка-счетчик. ict=иконка-счетчик-текст. i - иконка
- data-dislike-layout - порядок элементов в блоке dislike. Аналогично like-layout
- data-icon-size - размер иконки в пикселях.
- data-icon-style - стиль иконки. Число от 0 до 5
- data-icon-color - цвет иконки. Формат "rrggbb"
- data-text-size - размер текста в пикселях.
- data-text-color - цвет текста. Формат "rrggbb"
- data-count-clicks - true|false. Если true, то разрешает нажатие на кнопки. Если false, то выводит блок как статическую текстовую информацию.
- data-like-text - текст блока like
- data-like-title - подсказка блока like
- data-dislike-text - текст блока dislike
- data-dislike-title - подсказка для блока dislike
- data-disable-tooltip - true|false. Если true, то подсказка не отображается.
Объясню смысл параметра data-count-clicks. С помощью него можно вывести блок, отображающий количество лайков, но не дающий возможности нажать на кнопку. Так сделано, к примеру, в youtube: под общим количеством просмотров у них выводится количество голосов, а кнопки для голоса выводятся в левой части блока.
Анализируя работу кода в firebug, видим что на сервер уходит всего 2 запроса: запрос на скрипт ratingModule.js и скомпанованный запрос на параметры каждого блока, что ни коим образом не нагружает загружку страницы.
