How to Put Recent Post Widget Without Thumbnails On Blog

How to Put Recent Post Widget Without thumbnails On Blog - At this time I will share about How to Put Recent Post Widget Without thumbnails On Blog, with a simple view but it will not burdens loading on our blog.

Recent Post is a widget in pairs on the sidebar blog, which is where this post has a function as a widget to bring feeds from the latest posts on our blog. In this widget does not display post thumbnails and appearance is quite simple, which makes this widget is light and the process of loading the blog page will be faster.

For the way of application was fairly easy, so good for beginners can directly apply it, just by following some of his steps below.

How to Put Recent Post Widget Without thumbnails On Blog

1. Go to Blogger >> Choose Layout >> Add new Widget >> Choose HTML/JavaScript

2. Then Copy the code below and then Paste the HTML/JavaScript column

<style scoped='' type="text/css">
ul#recent-posts{list-style:none;margin:0;padding:0}li.recent-posts{display:block;clear:both;overflow:hidden;list-style:none;border-bottom:1px solid #e3e3e3;word-break:break-word;padding:10px 0;margin:0;}
li.recent-posts:last-child{border-bottom:0;}
li.recent-posts a{color:#444;}li.recent-posts a:hover{color:#444;text-decoration:underline}
</style>
<ul id="recent-posts"></ul>
<script>
//<![CDATA[
var homePage = "http://www.YOUR- BLOG-URL.com",
numPosts = 5;
function recentPosts(a){if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<li class="recent-posts"><a href="'+link+'" title="'+title+'" target="_blank" rel="nofollow">'+title+'</a></li>'}ct.innerHTML=content}}var rcp=document.createElement('script');rcp.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+numPosts+'&callback=recentPosts';document.getElementsByTagName('head')[0].appendChild(rcp);
//]]>
</script>

Note: Replace the code tagged with your blog URL and the number of posts to be displayed.

3. Save Widget. Finish and see the results.

So tips that I can share this about How to Put Recent Post Widget Without thumbnails On Blog, may be useful and useful for us. Thank you for visiting and good luck.

Share :