Виджет “Последние сообщения”

Рассмотрим 2 варианта виджетов "Последние сообщения" в сайдбаре блога, найденных на блоге Help Blogger. Tricks And Tutorials For You Blog (Помощь Blogger. Советы и учебники для вашего блога).

Вариант 1.
В виде простого списка.
Источник: Simple Recent Posts Widget For Blogger/Blogspot

Код-1 (вставляется в гаджет "HTML/JavaScript")

<div id="hlrpsb">
<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-titles-only.js"></script>
<script style="text/javascript">var numposts = 10;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>
<script src="http://exp13blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>
<div style="font-family: arial, sans-serif; font-size: 9px;" id="rpdr"><a href="http://helplogger.blogspot.com/2012/04/recent-posts-widget-for-bloggerblogspot.html" title="Grab this Recent Posts Widget" target="_blank">Recent Posts Widget</a> by <a href="http://helplogger.blogspot.com" title="Recent Posts Widget">Helplogger</a></div><noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type=text/css>
#hlrpsb a {color: #0B3861; font-size: 13px;} #rpdr {background: url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcZyR6KS6mQRXf5_H73c8qL9lJMKCCwAyp4LyiAr-OqVtli8hNoxPG6bb5m7Hxd9T8vw8qQdGF0E8AsyZegd5DDQoDVBoD7yokOcBijppimB6g_gHeuexWFh9w8VpcPRJachCxFIHug7Vv/s1600/blogger.png ) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rpdr, #rpdr a {color:#808080;}
.bbrecpost2 {
padding-top:6px;
padding-bottom:6px;
border-bottom: 1px #cccccc dotted; }
</style>

Пояснения к коду:
numposts = 10 - количество отображаемых последних сообщений (можно изменить)
numchars = 100 - количество символов, отображаемых в названии сообщений
http://exp13blog.blogspot.com - адрес вашего блога

Вариант 2.
Более интересный виджет с миниатюрами изображений, первыми строчками сообщений и полосой прокрутки.
Источник: Recent Posts Widget With Thumbnails For Blogger/Blogspot

Код-2 (вставляется в гаджет "HTML/JavaScript")

<div class="eggTray">
<script src="http://helplogger.googlecode.com/svn/trunk/listbadge.js">{"pipe_id":"1a6640e2a78b2c6e736f2220529daae5","_btype":"list",
"pipe_params":{"URL":"http://exp13blog.blogspot.com/feeds/posts/default"},
"hideHeader":"false","height":"500","count": 8 }</script>
<div style="font-family: arial, sans-serif; font-size: 9px;" class="ycdr"><a href="http://helplogger.blogspot.com/2012/05/recent-posts-widget-with-thumbnails-for.html" target="_blank" title="Grab this widget">Recent Posts Thumbnails</a> <a href="http://helplogger.blogspot.com/" target="_blank">Blogger Widget</a></div><noscript>Your browser does not support JavaScript!</noscript></div>
<style type=text/css>
.eggTray {margin:10px 0px;padding:0px;}
.ybr li  {border-bottom:0px #cccccc dotted; padding:0px 0px 10px 0px!important;}
.pipesTitle {padding-top:0px;}
.pipesDescription {display:true;}
.ycdr {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCXtANAxsHjOmBCOOKzh_1mJfUngRbmW2hD23v2NqAY7dROy2d2L5TZKVjC4E9H8JDIac4VgTig1wI9u2W5KOPR8puZf84Ek4IxNKOir3uXYNj60t_k9qL77q6uZXUsoG9H3bQ2ldBpPw/s1600/logo.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 4px 0px 0px 0px;line-height:14px;}
.ycdr, .ycdr a {color:#999999;}
.widget .popular-posts ul {padding-left:0;}
</style>

Пояснения к коду:
http://exp13blog.blogspot.com - адрес вашего блога
"height":"500" - высота виджета в px (можно изменить)
"count": 8 - количество отображаемых в виджете последних сообщений (можно изменить)

Поделиться в соц. сетях: