Recent posts widgets is one of the most useful widget for blogger. It can increase your Blog's page views to a greater extent. When a visitor reading a post of your blog, he may find another post useful from recent posts list. So, Recent Posts Widget can play an important role to make the visitors spent more time on your site. Today I am sharing a Simple Recent Posts Widget for Blogger.
I am presenting the two different types of this Recent Posts Widget. One shows only Posts title and other one shows not only Posts title but also snippets. The most interesting part of this widget is you can add this widget using HTML/Javascript gadget without editing the HTML page. See the below image.
Adding Recent Posts Widget To Blogger:
- Related Post: How To Add Recent Comment Widget In Blogger
I am presenting the two different types of this Recent Posts Widget. One shows only Posts title and other one shows not only Posts title but also snippets. The most interesting part of this widget is you can add this widget using HTML/Javascript gadget without editing the HTML page. See the below image.
Adding Recent Posts Widget To Blogger:
- First Log Into your Blogger account and go to Dashboard.
- Then click on Layout option and click on Add a Gadget link.
- Then from the Gadgets list choose HTML/Javascript.
- Now Copy any one of the following two Codes and Paste it in the Content box.
- Recent Posts Widget With Snippets:
- Recent Posts Widget With Post Title Only:
- The click Save button to add the widget.
| <div id="hlrpsa"> <script src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-snippets.js"> </script> <script> var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 100;var standardstyling = true; </script> <script src="http://Your-Blog-Address.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"> </script></div><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://www.ittimesbd.com/2014/08/simple-recent-posts-widget-for-blogger.html" rel="nofollow" >Recent Posts Widget</a> <noscript>Your browser does not support JavaScript!</noscript> <style type="text/css"> #hlrpsa a {color: #0B3861; font-size: 13px;} #rpdr, #rpdr a {color:#808080;} #hlrpsa { color: #999999; font-size: 11px; border-bottom:1px #cccccc dotted; margin-top:-10px; padding-bottom:10px;} .hlrps a {font-weight:bold; } .hlrpssumm {} </style> |
| <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://Your-Blog-Address.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://www.ittimesbd.com/2014/08/simple-recent-posts-widget-for-blogger.html" rel="nofollow" >Recent Posts Widget</a> <noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript> <style type=text/css> #hlrpsb a {color: #0B3861; font-size: 13px;} #rpdr, #rpdr a {color:#808080;} .bbrecpost2 { padding-top:6px; padding-bottom:6px; border-bottom: 1px #cccccc dotted; } </style> |
Customization:
- Change the value of numposts = in the above codes to determine how many posts you want to show on this widget.
- Change false to true if you want posts dates to appear.
- Change 100 digit in 1st code to more characters in snippets of the widget.
- Replace http://Your-Blog-Address.com with your Bloge Address URL.
Stay with www.iTTimebd.com for more IT related Post
No comments:
Post a Comment