Recent Posts Ticker Thumbnail

Paste above </head>

<script>
/*! vTicker 1.15
http://richhollis.github.com/vticker/ | http://richhollis.github.com/vticker/license/ | based on Jubgits vTicker http://www.jugbit.com/jquery-vticker-vertical-news-ticker/ */
(function(d){var n={speed:700,pause:4E3,showItems:1,mousePause:!0,height:0,animate:!0,margin:0,padding:0,startPaused:!1},c={moveUp:function(a,b){c.animate(a,b,"up")},moveDown:function(a,b){c.animate(a,b,"down")},animate:function(a,b,e){var c=a.itemHeight,f=a.options,k=a.element,g=k.children("ul"),l="up"===e?"li:first":"li:last";k.trigger("vticker.beforeTick");var m=g.children(l).clone(!0);0<f.height&&(c=g.children("li:first").height());c+=f.margin+2*f.padding;"down"===e&&g.css("top","-"+c+"px").prepend(m);
if(b&&b.animate){if(a.animating)return;a.animating=!0;g.animate("up"===e?{top:"-="+c+"px"}:{top:0},f.speed,function(){d(g).children(l).remove();d(g).css("top","0px");a.animating=!1;k.trigger("vticker.afterTick")})}else g.children(l).remove(),g.css("top","0px"),k.trigger("vticker.afterTick");"up"===e&&m.appendTo(g)},nextUsePause:function(){var a=d(this).data("state"),b=a.options;a.isPaused||2>a.itemCount||f.next.call(this,{animate:b.animate})},startInterval:function(){var a=d(this).data("state"),b=
this;a.intervalId=setInterval(function(){c.nextUsePause.call(b)},a.options.pause)},stopInterval:function(){var a=d(this).data("state");a&&(a.intervalId&&clearInterval(a.intervalId),a.intervalId=void 0)},restartInterval:function(){c.stopInterval.call(this);c.startInterval.call(this)}},f={init:function(a){f.stop.call(this);var b=jQuery.extend({},n);a=d.extend(b,a);var b=d(this),e={itemCount:b.children("ul").children("li").length,itemHeight:0,itemMargin:0,element:b,animating:!1,options:a,isPaused:a.startPaused?
!0:!1,pausedByCode:!1};d(this).data("state",e);b.css({overflow:"hidden",position:"relative"}).children("ul").css({position:"absolute",margin:0,padding:0}).children("li").css({margin:a.margin,padding:a.padding});isNaN(a.height)||0===a.height?(b.children("ul").children("li").each(function(){var a=d(this);a.height()>e.itemHeight&&(e.itemHeight=a.height())}),b.children("ul").children("li").each(function(){d(this).height(e.itemHeight)}),b.height((e.itemHeight+(a.margin+2*a.padding))*a.showItems+a.margin)):
b.height(a.height);var h=this;a.startPaused||c.startInterval.call(h);a.mousePause&&b.bind("mouseenter",function(){!0!==e.isPaused&&(e.pausedByCode=!0,c.stopInterval.call(h),f.pause.call(h,!0))}).bind("mouseleave",function(){if(!0!==e.isPaused||e.pausedByCode)e.pausedByCode=!1,f.pause.call(h,!1),c.startInterval.call(h)})},pause:function(a){var b=d(this).data("state");if(b){if(2>b.itemCount)return!1;b.isPaused=a;b=b.element;a?(d(this).addClass("paused"),b.trigger("vticker.pause")):(d(this).removeClass("paused"),
b.trigger("vticker.resume"))}},next:function(a){var b=d(this).data("state");if(b){if(b.animating||2>b.itemCount)return!1;c.restartInterval.call(this);c.moveUp(b,a)}},prev:function(a){var b=d(this).data("state");if(b){if(b.animating||2>b.itemCount)return!1;c.restartInterval.call(this);c.moveDown(b,a)}},stop:function(){d(this).data("state")&&c.stopInterval.call(this)},remove:function(){var a=d(this).data("state");a&&(c.stopInterval.call(this),a=a.element,a.unbind(),a.remove())}};d.fn.vTicker=function(a){if(f[a])return f[a].apply(this,
Array.prototype.slice.call(arguments,1));if("object"!==typeof a&&a)d.error("Method "+a+" does not exist on jQuery.vTicker");else return f.init.apply(this,arguments)}})(jQuery);

function getauthor(t) {
for (var e = 0; e < t.length; e++) var a = t[e].name.$t;
return a;
}
function getmeta(t) {
var e = [];
e[1] = "Jan", e[2] = "Feb", e[3] = "Mar", e[4] = "Apr", e[5] = "May", e[6] = "Jun", e[7] = "Jul", e[8] = "Aug", e[9] = "Sep", e[10] = "Oct", e[11] = "Nov", e[12] = "Dec";
var a = t.substring(0, 4),
s = t.substring(5, 7),
r = t.substring(8, 10),
n = e[parseInt(s, 10)] + " " + r + " " + a;
return n;
}
function bloggerEverTicker(e){
var con=document.querySelector('#ticker'),
entries=e.feed.entry,
item="<ul id='ticket-wrapper-inner'>"
if(entries){
for(var i=0;i<entries.length;i++){
var en = entries[i];
for (var j = 0; j < en.link.length; j++) {
if (en.link[j].rel == 'alternate') {
var postUrl = en.link[j].href;
break;
}
}
try{
var Img='<img src="'+en.media$thumbnail.url+'"/>';
}catch(e){
var Img="";
}
var ti=en.title.$t,
author=getauthor(en.author),
date=getmeta(en.published.$t);
item+='<li>'+Img+'<h3><a href="'+postUrl+'">'+ti+'</a></h3><div class="tickermeta"><span>'+author+'</span> - <span>'+date+'</span></div></li>';
}
item+='</ul>';
con.innerHTML=item;
}
$('#ticker').vTicker();
}
$(function(){
var e=document.createElement('script');
e.src='http://'+$('.ticker-outer').data('domain')+'/feeds/posts/summary?alt=json&callback=bloggerEverTicker';
e.type='text/javascript';
document.getElementsByTagName('body')[0].appendChild(e);
});

</script>


Paste above </b:skin>

.ticker-outer{
text-align:center;
}
.ticker-outer>span{
display:inline-block;
background:#ccc;
padding:10px;
font:700 13px 'segoe ui',sans-serif;
box-shadow:0 0 10px rgba(0,0,0,0.6);
}
.ticker-outer>span>a{
color:#222;
text-decoration:none;
}
#ticker{
height:50px;
overflow:hidden;
background:#eee;
text-align:left;
}
#ticker ul{
padding:0;
margin:0;
list-style:none;
}
#ticker ul li{
height:50px;
white-space:nowrap;
}
#ticker ul li img{
float:left;
width:40px;
height:40px;
margin:5px;
}
#ticker ul li h3{
margin:0;
font:500 18px 'segoe ui',sans-serif;
}
#ticker ul li h3 a{
color:#222;
text-decoration:none;
line-height:30px !important;
}
#ticker ul li .tickermeta{
font:400 13px 'segoe ui',sans-serif;
line-height:20px !important;
color:#bbb;
}


And.... Go to

1. Layout
2. Add a Gadget
3. HTML / JavaScript

<div class='ticker-outer' data-domain='bloggerever.com'>
<div id="ticker">
</div></div>



note: BLUE text replace with your blog/site

 DEMO :   
see on the right side