Голосование на основе стандартного гаджета

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

Как говорится "совершенству нет предела", и в этой заметке я расскажу как сделать голосование лишенное этих недостатков. В макете добавляем стандартный гаджет Опрос



Вводим вопрос и варианты ответов, затем сохраняем макет и открываем блог в браузере. Открываем исходный код страницы, и ищем слово poll. Сохраняем html от <div class='widget Poll' id='Poll1'> до закрывающего тега </div>, после которого идет следующий виджет, например архив: <div class='widget BlogArchive' id='BlogArchive2'>. Этот код теперь можно вставить в сообщение, а гаджет удалить из макета. При этом сам опрос и его результаты останутся в базе данных гугла. Теперь можно даже изменять опрос на странице обычном для гаджета способом: в админском режиме под ним будет кнопка , при нажатии на которую открывается меню редактирования опроса.

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

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

Голосование на основе Действий

Действия, которые чаще всего используются для оценок статей можно настроить для пользовательский голосований. Во внутреннем фрейме открывается список пунктов для голосования. Запрос посылается на http://www.blogger.com/blog-post-reactions.g с параметрами:

• url - идентификатор опроса, по которому будут храниться данные голосования. Это должен быть URL на новую страницу. Удобно выбирать его таким способом: http://ваш блог.blogspot.com/reactions-идентификатор.html
  
• options - пункты голосования. Разделитель - запятая. Пример: options=[пойду сдавать анализ,+надо бы провериться,+у меня все в порядке,+все это брехня ;-),+нет времени на такую ерунду!]
  
• textColor - цвет текста. Пример: textColor=%23333333.

По умолчанию пункты опроса будут расположены в строку - один за другим. Чтобы придать ему более стандартный вид в столбик, надо задать соответствующие ширину и высоту фрейма с помощью атрибута style. Например: style='width:20em;height:8em'.

Вот что получилось:

<iframe style='width:20em;height:8em'
frameborder='0' scrolling='no'
src='http://www.blogger.com/blog-post-reactions.g?url=http://cheburgen.blogspot.com/2008/11/reactions-dizbakterioz.html&options=[пойду сдавать анализ,+надо бы провериться,+у меня все в порядке,+все это брехня ;-),+нет времени на такую ерунду!]&textColor=%23333333'>
</iframe>


Как это работает можно посмотреть на странице о дисбактериозе, а заодно и проголосовать :-)

Настройка оценок в шаблоне заметки

В макете на странице настройки сообщения блога есть элемент Действия. Его удобно использовать для читательской оценки статьи.


Однако у этого элемента есть странное ограничение на количество пунктов. Причем это ограничение зависит от шаблона блога и колеблется от 3 до 5. В макете может быть много пунктов для Действия, но показаны будут не все.

Расследование показало, что кнопки загружаются в iframe, высота которого ограничена стилем.

.reactions-iframe
{
background:transparent;height:2.3em;width:100%;border:0
}

Чтобы кнопки голосования на странице отображались в 2 ряда надо удвоить высоту элемента. Для этого находим на макете <iframe class='reactions-iframe' ... > и добавляем style='height:4.6em'. Результат можно посмотреть под этой заметкой.