Довненько не писал я для фанатов Blogger-блоговодства. Но вот время пришло … Занимаясь плагинами для WordPress, я неплохо поднял уровень своей “подкованности” в javascript и пришёл к выводу, что пора пересмотреть концепцию всех моих виджетов для Blogger. Начал я с виджета Active Commentators и вот что у меня получилось: две версии виджета – Lite и Pro. Обе версии написаны с использованием библиотеки jQuery, что позволило существенно (в разы) уменьшить время загрузки данных и значительно упростить установку виджета.
Возможности
Почему две версии? Потому что кому-то могут не понравиться нововведения, кроме того, Pro версия загружается медленнее априори, хотя на глаз это незаметно. Короче – выбор должен быть! 😉
Lite версия: Выводит список самых активных комментаторов с указанием количества оставленных комментариев.
Pro версия: То-же что и Lite, плюс, при наведении курсора мыши на одного из комментаторов в списке, выводит хинт со списком последних комментариев оного. Демо виджета в реале (Pro версия) можно посмотреть здесь (правый сайдбар-левый малый сайдбар “Самые активные“).
Установка
Вставьте нижеследующий код в секцию head
Lite версия
1 2 3 4 5 6 7 8 9 10 11 12 |
<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'></script> <script type="text/javascript" src="//blogovod.fileave.com/js/ac.js"></script> <script type="text/javascript"> var acOptions = { maxList : 7, filterStr : 'minimus', baseUrl : '<data:blog.homepageUrl/>', authorUrl : true, loadStr : 'Загрузка данных ...', errorStr : 'Ошибка ...' }; </script> |
- maxList – максимальное количество комментаторов в выводимом списке. По умолчанию 7
- filterStr – ники тех комментаторов, которых Вы хотите исключить из выводимого списка (например: себя любимого). По умолчанию пустая строка
- baseUrl – этот параметр автоматически определяет URL блога, ни в коем случае не изменять!!!
- authorUrl – ссылка на блог автора (на меня), поставьте false, если не хотите, чтобы она выводилась. По умолчанию true
- loadStr – Строка выводящаяся во время загрузки данных. По умолчанию ‘Loading …’
- errorStr – Строка выводящаяся в случае ошибки доступа к данным (например: “накрылся медным тазом” сервер Google, что невозможно в принципе). По умолчанию ‘Error …’
Pro версия
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'></script> <script type="text/javascript" src="//blogovod.fileave.com/js/jquery.qtip-1.0.0-rc3.min.js"></script> <script type="text/javascript" src="//blogovod.fileave.com/js/ac.pro.js"></script> <script type="text/javascript"> var acOptions = { maxList : 7, filterStr : 'minimus', baseUrl : '<data:blog.homepageUrl/>', authorUrl : true, loadStr : 'Загрузка данных ...', errorStr : 'Ошибка ...', tipWidth : 300, lastCommentsNum : 3, lastCommentsStr : 'Последние комментарии:', totalCommentsStr : 'Всего комментариев:', theme : 'cream', fontSize : 12, tipPosition : 'top' }; </script> |
- maxList – максимальное количество комментаторов в выводимом списке. По умолчанию 7
- filterStr – ники тех комментаторов, которых Вы хотите исключить из выводимого списка (например: себя любимого). По умолчанию пустая строка
- baseUrl – этот параметр автоматически определяет URL блога, ни в коем случае не изменять!!!
- authorUrl – ссылка на блог автора (на меня), поставьте false, если не хотите, чтобы она выводилась. По умолчанию true
- loadStr – строка выводящаяся во время загрузки данных. По умолчанию ‘Loading …’
- errorStr – строка выводящаяся в случае ошибки доступа к данным (например: “накрылся медным тазом” сервер Google, что невозможно в принципе). По умолчанию ‘Error …’
- tipWidth – ширина хинта последних комментариев в пикселах. По умолчанию 300
- lastCommentsNum – количество выводимых последних комментариев. По умолчанию 3
- lastCommentsStr – строка-заголовок “Последние комментарии:”. По умолчанию ‘Last comments:’
- totalCommentsStr – строка “Всего комментариев:”. По умолчанию ‘Total Comments:’
- theme – тема хинта: cream|dark|green|light|red|blue. По умолчанию cream
- fontSize – размер шрифта. По умолчанию 12
- tipPosition – позиция хинта относительно тела виджета top|right|left|bottom. По умолчанию top
На странице Дизайн-Элементы страницы добавьте гаджет HTML/Javascript и вставьте код
1 |
<div id="ac-mx"></div> |
Вот и всё!
Скачать
© 2009 – 2013, minimus. Все права защищены. При копировании и републикации статьи, ссылка на первоисточник обязательна.
Не практично подкачивать скрипты с чужих сайтов 🙁
P.S. – визуальный редактор для комментариев – это какой плагин?
Согласен! Поэтому можно скачать и разместить на собственном ресурсе 😉
По P.S. – MCEComments
Мне по подписке на почту пришло письмо с текстом этого поста, но почему-то вытянутого в ширину 🙂
Возможно из-за текста скрипта…
Возможно …
Пришел за виджетом «Активные комментаторы» для блогспота. Спасибо.
Но вот беда, не получается засунуть его в хтмл блога. Не посоветуете что делать?
А что именно не получается? Blogger не принимает код или виджет не работает?
Виджет не работает, но может я не так что-то делаю? Я вставляю код на закладке “изметить хтмл” сразу после тэга <head>.
Спасибо
Вы используете мой ресурс или закачали куда-нибудь?
Как-то странно работают
tipPosition для left & right
наоборот так сказать
left – показывать тип слева от виджета, right – справа …
Minimus, спасибо за виджет уже работает (внизу справа), но есть проблема. Виждет отрабатывает только тогда когда открыта страница поста, но на главной при отображении всего перечня постов не работает. Прошу помочь в решении проблемы. Еще раз спасибо!
У Вас какие-то проблемы с загрузкой скриптов с Google Sites …
>На странице Дизайн-Элементы страницы добавьте гаджет HTML/Javascript и вставьте код
> Вот и всё!
А какой код вставлять?
Один из … Pro или Lite …
Видимо, туплю, но никак не пойму: текст кода Lite или Pro из статьи надо вставлять сразу в двух местах блога – в секции <head> HTML шаблона и ещё то же самое в виджете? Или как?
Исправил статью … Надеюсь теперь всё будет понятно …
“На странице Дизайн-Элементы страницы добавьте гаджет HTML/Javascript и вставьте код
Вот и всё!”
Какой код?
Lite или Pro …