Saturday, 4 January 2014

How To Add Recent Posts Widget In Blogger/Blogspot

Adding recent posts widget to blogger/blogspot is one of the best way to get more views on your recent posted articles as google delivers high ranks to those posts which are most viewed by the users, so it is necessary for a post to have good views behind having well SEO optimization. By adding recent post slider, it provides the opportunity to the viewers to view the articles related to their interest just by adding it on homepage instead of giving your links in posts to get more views. Here we go...
How to add recent posts scrolling widget to blogspot/blogspot
"Recent Posts Widget View"

How to add recent posts widget to blogspot/blogger/blog with thumbnails:

Now let me introduce the steps on "adding recent post/posts widget in blogger/blogspot". You can add both the scrolling and simple recent post widgets. lets start just in two steps:
  1. First of all, log in to blogger.com and go to:
    Layout > Add a Gadget > HTML/Javascript(Place this gadget on right/left column above or below the popular posts/labels gadget as it looks cool there and viewers viewing the homepage/post can view it easily)
  2. Now paste this code in HTML/Javascript content:
    <div class="eggTray">
    <script src="http://helplogger.googlecode.com/svn/trunk/listbadge.js">{"pipe_id":"1a6640e2a78b2c6e736f2220529daae5","_btype":"list",
    "pipe_params":{"URL":"YOUR SITE URL/feeds/posts/default"},
    "hideHeader":"false","height":"500","count": 8 }</script>
    <div style="font-family: arial, sans-serif; font-size: 9px;" class="ycdr"><a href="http://ethicalsoftwares.blogspot.com/2014/01/add-recent-posts-widget-blogger-blogspot.html" target="_blank" title="Grab this widget">Recent Posts Thumbnails</a> <a href="http://ethicalsoftwares.blogspot.com/" target="_blank">Blogger Widget</a></div><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 {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI6FWr0PtZa7YYQY1ORg732a1hnFf7OXz6CYgC5SJCHwCsTts5jvnJKCGt6_d_NJEDG5jc2AHloKagP48w-BINusV_Nyq0BQ4DhDXNdQHopuHdfSUYbD-w7EePnCBgXpFojhkgdo7cun4/s1600/logo.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 4px 0px 0px 0px;line-height:14px;}
    .ycdr, .ycdr a {color:#999999;}
    .widget .popular-posts ul {padding-left:0;}
    </style>
    (Put Content Title of your own choice like "Recent Posts" or "Posts of this Week" or  "Most viewed" or other such title which attract users to view it)

    Changings To Do:

    • Replace YOUR SITE URL with your site URL (homepage link) like:
      http://ethicalsoftwares.blogspot.com
    • By default, there will be seven posts shown, if you want to change the number, just replace the number "7" with the number of posts you want to show.
    • Posts will be shown in scrolling bar by default, if you want to remove scrolling, just remove the number 55 from above code and leave it at it is. 

    Now, you are done, If you are unable to use this widget or feeling any difficulty than kindly provide us feedback, I'm ready to solve you whatever you are facing and will highly appreciate your feedback. Stay tuned!

No comments:

Post a Comment