Home
Tutorial
How to Make a Simple Responsive Recent Posts in Blogspot
<script>
//<![CDATA[
function showlatestposts(json){document.write('<ul id="recent-posts">');for(var i=0;i<5;i++){var
entry=json.feed.entry[i];var posttitle=entry.title.$t;var postsurl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){postsurl=entry.link[k].href;break;}}
document.write('<li class="recent-posts">');document.write('<a href="'+ postsurl+'" target ="_top" title="'+ posttitle+'">'+ posttitle+'</a>');document.write('</li>');}
document.write('</ul>');};
document.write("<scr" + "ipt type=\"text/javascript\" src=\"/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestposts\"></scr" + "ipt>");
//]]>
</script>
<style type='text/css'>
#recent-posts{
width:auto;
padding:0 10px;
margin:0 auto;
border:1px solid #ddd;
}
#recent-posts ul,#recent-posts li {
list-style:none;
}
#recent-posts a{
text-decoration:none;
}
#recent-posts li{
border-top:1px solid #ddd;
padding:6px 0
}
#recent-posts li:first-child{
border-top:none;
}
</style>