To add the Recent Posts widget with thumbnails in Blogger is very easy. Just follow these steps below:
![Recent Posts Widget With Thumbnails recent posts, blogger widgets](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifeRqv6Mj5nGoGUWVIW41K0pCu8gvdJpF9UQcGKN0QAok-_SQdPJN5sVyYnp_lipq45v7iDXB_f4r_XSJ4pl-bsuMRBXNfVT3KUHuYjBBnp71LH73gD9jHsHB0vtvc_E59YR1iQepbQUvf/s320/recent+posts+widget+with+thumbnails+for+blogger+blogspot.png)
How to Add the Recent Posts Widget to Blogger
Step 1. From your Blogger Dashboard, go to Layout > click on Add a Gadget link![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0ULxpHZDs5ninUzRqLPD6g2QdGBN2QFOxxeNxhLlzqeyOqjenNldS4XZJK-j0KzbfpKgwOufcDUEQxOdY0Yw2R8-na8ZH9G13RcCjExDYSqegyn0DMJ4KfRbdQglg3ApWf4l2kz6Qp_tf/s640/blogger-layout-add+a+gadget-how-to.png)
Step 2. Once the pop-up window appears, scroll down and choose HTML/JavaScript
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj51M9JeeM9BghbVa1DVNPcs7qpzprS-ALasYrtqGIgqjlHd2Z6UwxmeCGByObi9IXFhgf1XNcTfmY6M0gDWVW9qLjsOzGNBshEMwIYUsD6KRftmXUJZm8QFv9H_EozQFi6SFgiXPESme_q/s400/blogger-widgets-gadgets-tutorials-tricks-helplogger-html-javascrip.png)
Step 3. Inside the empty box, add the following code:
<div class="eggTray">
<script src="https://googledrive.com/host/0B4n9GL3eVuV-bFc4a1RjZ2Zhbjg">{"pipe_id":"1a6640e2a78b2c6e736f2220529daae5","_btype":"list",
"pipe_params":{"URL":"YOUR-BLOG/feeds/posts/default"},
"hideHeader":"false","height":"500","count": 8 }</script>
<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, .ycdr a {color:#999999;}
.widget .popular-posts ul {padding-left:0;}
</style>
Recent Posts widget settings
- replace YOUR-BLOG with the url of your site or blog (ex: http://blogger.chipchuck.com) and look to have just one forward slash symbol "/" at the end of the url otherwise will not work- to disable the scroll bar, remove the 500 value
- by default, this widget is set to display a maximum of 8 recent posts. To change this number, replace 8 with the number of posts that you want to show
- to display only the post titles, change true to none and "0" from padding-top:0px with 10
Step 4. Save your widget. And you're done!
No comments:
Post a Comment