Динамические шаблоны Blogger и виджеты

2012-09-22
Динамические шаблоны Blogger выглядят хорошо, но они поддерживают всего лишь несколько официальных виджетов. Сегодня мы немного поработаем над динамическими шаблонами и посмотрим, как в них можно добавить сторонние виджеты (на примере рейтингов Graddit, разумеется).

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

Итак, наша цель - отображать виджеты, когда пользователь раскрывает заметку в любом из видов (Classic, Flipcard, Magazine, Mosaic, Sidebar, Snapshot и Timeline).

Для начала откройте панель управления Блоггера и перейдите на закладку Template; нажмите Edit HTML, а потом кнопку Proceed.
При работе с динамическими шаблонами нам недоступна большая часть функционала шаблонизатора. То есть, изменить шаблон и даже сохранить его вы сможете, но это ничего не изменит в поведении интерфейса. Но нам много и не надо. Добавьте в секцию <head>...</head> две строки:

<link href='http://static.graddit.com/css/graddit.css' rel='stylesheet' type='text/css'/>
<script src='http://static.graddit.com/js/graddit-extras.js' type='text/javascript'/>

Это стили и несколько скриптов, расширяющих функционал виджетов Graddit. Нам, правда, нужна только функция gradditBloggerDynamicViewsRatingsHack. Теперь перейдите в самый конец шаблона и перед закрывающимся тегом </body> вставьте этот вызов:

<script type='text/javascript'>setTimeout(function(){gradditBloggerDynamicViewsRatingsHack();},1000);</script>

Или вот этот, если вы хотите чтобы отображались ещё и похожие страницы:

<script type='text/javascript'>setTimeout(function(){gradditBloggerDynamicViewsRatingsHack(true);},1000);</script>

Сохраните шаблон и закройте редактор. Нажмите кнопку Customize - нам нужно добавить несколько стилей, без которых виджеты будут отображаться неверно. Выберите Advanced и нажмите Add CSS. Добавьте вот такие стили:

.article .article-content .ffbs_rate img {
padding: 0;
border: 0;
border-image: none;
-webkit-border-image: none;
vertical-align: middle;
}

.article .article-content .ffbs_stats {
font-size: 10px;
}

.article .article-content a {
border: 0;
}

Нажмите Apply to Blog.

Вот и всё, виджеты должны заработать. Откройте свой блог и убедитесь. Вот как это работает в тестовом блоге: http://ffbs-widgets.blogspot.com/.
Получилось?

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


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

Новые виджеты Graddit для голосования

2012-09-16
Graddit представляет виджеты для голосования, которые вы можете встроить в свои блоги или сайты. Так выглядит простой виджет:

{[['Плохо','  |  '],['Средне','  |  '],['Отлично']]}

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

{[['Плохо','&nbsp;&nbsp;|&nbsp;&nbsp;'],['Средне','&nbsp;&nbsp;|&nbsp;&nbsp;'],['Отлично']]}, где '&nbsp;&nbsp;|&nbsp;&nbsp;' - это разделители между пунктами; количество пунктов должно совпадать с числом, передаваемом скрипту в качестве параметра (в данном случае 3).

Вместо текста могут быть любые элементы. Например, можно сделать голосование за картинки:

Кто круче?
{[['','    '], ['','    '], ['']]}


И, конечно, обычное голосование с графиком. Как вам новые виджеты?
{[['Так себе'],['Нормально'],['Великолепно']]}

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


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

Статистика в Graddit

2012-09-03
В личном кабинете сервиса Graddit появилась новая закладка "Статистика". Теперь можно посмотреть, какие страницы получили больший рейтинг, количество голосов или просмотров, где больше отзывов. Кроме того, можно узнать некоторые интересные данные о страницах, такие как Google Pagerank, Alexa Rank, количество упоминаний в Facebook и Twitter. Это первая версия статистики, со временем туда будут добавляться новые возможности (куда же без ТИЦ Яндекса?). Вот как выглядит закладка сейчас:

Таблицу можно сортировать. Чтобы получить информацию о странице, нажмите на ссылку ⟳ в нужной строке. Сообщения об ошибках и предложения по улучшению оставляйте в комментариях.

Обновление от 18 сентября 2012: теперь в статистике есть Яндекс тИЦ.

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


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