My Blog Widgets: Infinite Scrolling

Advanced Auto Scrolling Recent Posts Widget Generator For Blogger / Blogspot

<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOm4gWsfF-c8LnH1RWYAqyJfNaoZ86wV3WXG9sjF_UEd8-s5u9N1coPPGephbZWM3UjjsfmfdASoI0ebTIp9d2wuJIshyVo0yH6h_RzTGbHTnil9FbT9aiVTDoQUL94d7L799DiIo3Vxt5/s1600/Advanced+Auto+Scrolling+Recent+Posts+Widget+Generator+For+Blogger++Blogspot.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" height="146" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOm4gWsfF-c8LnH1RWYAqyJfNaoZ86wV3WXG9sjF_UEd8-s5u9N1coPPGephbZWM3UjjsfmfdASoI0ebTIp9d2wuJIshyVo0yH6h_RzTGbHTnil9FbT9aiVTDoQUL94d7L799DiIo3Vxt5/s320/Advanced+Auto+Scrolling+Recent+Posts+Widget+Generator+For+Blogger++Blogspot.png" width="320" /></a></div>
If you have a lot of post on the blog, or if you want to show everyone 
your list of favorite books, but have little space in the sidebar widget
 this will be a great help to you. This post explains how to add auto 
scrolling (marquee) recent posts Widget on his blog that looks good on 
your blogspot blog. This is similar to the display of recent post in 
your sidebar, but this will have a marquee in this widget. Now if you 
want to show your blog in this way, either on top or bottom of your 
blog, then you can use this new widget. <br />
<table align="center" cellpadding="0" cellspacing="0" class="tr-caption-container" style="margin-left: auto; margin-right: auto; text-align: center;"><tbody>
<tr><td style="text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4axKNmHtv4V0PsFkLu0rMz-iobaXuALOFjPHa-lLoBMiIGVsocQ_BgX4kYwTikd13LTvPEHw8fenqv3V6CAUgas4kIZ75K0gyCEXhLTLah317obAvvlMjrG7oEi3kzJRG3CHx4DFoLDuM/s1600/Advanced+Auto+Scrolling+Recent+Posts+Widget+Generator+For+Blogger++Blogspot.gif" imageanchor="1" style="margin-left: auto; margin-right: auto;"><img border="0" height="72" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4axKNmHtv4V0PsFkLu0rMz-iobaXuALOFjPHa-lLoBMiIGVsocQ_BgX4kYwTikd13LTvPEHw8fenqv3V6CAUgas4kIZ75K0gyCEXhLTLah317obAvvlMjrG7oEi3kzJRG3CHx4DFoLDuM/s640/Advanced+Auto+Scrolling+Recent+Posts+Widget+Generator+For+Blogger++Blogspot.gif" width="640" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;">This Widget is look like this scrolling.</td></tr>
</tbody></table>
<br />
<span style="color: #0b5394;"><span style="font-size: large;"><b><span style="font-family: 'Trebuchet MS',sans-serif;">How to Install This Widget On 'Blogger' ?</span></b></span></span><br />
<ol>
<li><b>Customize Options</b> in Given <span style="color: #0b5394;"><b>Widget Generator Form</b></span></li>
<li>Click on <span style="color: #0b5394;"><span style="font-size: medium;"><b>Generate</b></span> </span>Button</li>
<li>Click <span style="color: #0b5394;"><span style="font-size: medium;"><b>Preview</b></span></span>** Button to see your widget Preview </li>
<li>Finally Click<span style="color: #0b5394;"> <span style="font-size: medium;"><b>Add to Blogger</b></span></span> Button to add this widget on Your blog</li>
</ol>
<div style="font-family: Georgia,"Times New Roman",serif;">
<i style="color: #999999;">**Note:- After changing any values, First Click <b><span style="color: #0b5394;">Generate </span></b>Button and then See Your <span style="color: #0b5394;"><b>Preview</b></span></i></div>
<i><span style="color: #999999;"><b style="font-family: Georgia,"Times New Roman",serif;"> </b><span style="font-family: Georgia, 'Times New Roman', serif;">Note:-</span><b style="font-family: Georgia,"Times New Roman",serif;"> </b><span style="font-family: Georgia, 'Times New Roman', serif;">Choose appropriate Image Bullet or Icon That have transparent <b><span style="color: #0b5394;">Background </span></b>and small in <span style="color: #0b5394;"><b>Size  </b></span></span> </span></i>

<br />
<br />
<br />
<center>
<iframe frameborder="0" height="700px" scrolling="no" src="http://dl.dropboxusercontent.com/s/e06ywvmp3uye0zn/Advanced%20Auto%20Scrolling%20Recent%20Posts%20Widget%20Generator%20For%20Blogger.html" width="700px"></iframe></center>
<div style="text-align: center;">
<span style="color: #0b5394;"><b>If any Problem Ask in Comments.</b></span></div>

Advanced Auto Scrolling Recent Posts Widget Generator For Blogger / Blogspot

If you have a lot of post on the blog, or if you want to show everyone your list of favorite books, but have little space in the sidebar ...

How to Add JQuery Load More Posts OR Infinite Scrolling to Blogger

<span style="font-family: inherit;">Technology
 is running with rocket's speed and also technology is increasing in 
the world of web that why we can add as much as new features in the blog
 be'coz blogging is so much flexible than a website. So, we can add many
 new and professional features in our blog and same like it "There is an
 another feature named as <b><span style="color: #0b5394;">LOAD MORE POSTS</span></b>. Today you will get to 
know that how can we add that <b><span style="color: #0b5394;">LOAD MORE POSTS</span></b> or <b><span style="color: #0b5394;">INFINITE POSTS 
SCROLLING</span></b>. This is very simple and very easy to install but this effect 
made by jQuery.</span><br />
<span style="font-family: inherit;"><br /></span>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUTIBm3tDzEuy-px6KGxV5u7khgujGbCFPXrsSe2c9Tc-uN1afEMBvanxaQf1F7_Flz4xAB7tTQIwiPNwLRZsjFVHt3QRH9Kn6pzQoqnaBbRwuHl8V6tl-1cWaEjsK1nMcF1EYYG9tuQcw/s1600/How+to+Add+Load+More+Posts+OR+Infinite+Scrolling+to+Blogger.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="480" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUTIBm3tDzEuy-px6KGxV5u7khgujGbCFPXrsSe2c9Tc-uN1afEMBvanxaQf1F7_Flz4xAB7tTQIwiPNwLRZsjFVHt3QRH9Kn6pzQoqnaBbRwuHl8V6tl-1cWaEjsK1nMcF1EYYG9tuQcw/s640/How+to+Add+Load+More+Posts+OR+Infinite+Scrolling+to+Blogger.jpg" width="640" /></a></div>
<span style="font-family: inherit;"><br /></span>
<b><span style="color: #0b5394;">Step 1 :</span></b> Now let's start adding it...

<br />
<br />
<br />
<div>
<div style="text-align: right;">
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 2:</span></b> Login to Your Blogger Account.Go to your <span style="color: #0b5394;"><b>Blogger Dashboard></b><b style="background-color: white;">Template</b>> <b><span style="background-color: white;">Edit HTML</span></b>> <b>Proceed</b>.</span></div>
<div style="text-align: left;">
<span style="color: #0b5394;"><br /></span></div>
</div>
<div style="text-align: right;">
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 3:</span></b> Find [by pressing  <kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">Ctrl</kbd><span style="font-family: Georgia, serif; font-size: 13.63636302947998px;"> + </span><kbd style="border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-top-left-radius: 3px; border-top-right-radius: 3px; border: 1px solid gray; box-shadow: rgb(238, 238, 238) 1px 0px 1px 0px, rgb(204, 204, 204) 0px 2px 0px 2px, rgb(68, 68, 68) 0px 2px 0px 3px; font-size: 1.2em; margin: 2px 3px; padding: 1px 5px;">F</kbd> ] this code in the template:</div>
<blockquote class="tr_bq" style="text-align: left;">
<span style="font-size: x-small;"><span style="font-family: "Courier New",Courier,monospace;"></head></span></span></blockquote>
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 4:</span></b><span style="font-family: inherit;"> <span style="font-size: medium; text-align: right;">Paste below code before </head></span></span></div>
<blockquote class="tr_bq" style="text-align: left;">
<span style="font-family: "Courier New",Courier,monospace;"><b:if cond='data:blog.pageType == "index"'><br />
<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'/><br />
<script src='https://googledrive.com/host/0Bxsq9VDr3zyFMjNlYjhNeWlza1U' type='text/javascript'/><br />
<script type='text/javascript'><br />
jQuery.ias({<br />
    container : '.blog-posts',<br />
    item: '.post-outer',<br />
    pagination: '#blog-pager',<br />
    next: '#blog-pager-older-link a',<br />
    loader: 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-cSjtHWjiGGDAOoVrLrV1XhzYSpjUXedqBnpSCed9BMlseQaN94ZoXNS3QNf8gLwD1K9Cz73cuigdjLoB5UBGo48CQgG7ROI656LRHIqacYpXwppmiJTy_ieY3kSShHQkexer2o4bkPRg/s1600/wgloading.gif'<br />
});<br />
  </script><br />
</b:if></span></blockquote>
<br />
<div style="text-align: left;">
<b><span style="color: #0b5394;">Step 5:</span></b> <span style="font-family: inherit;">You have Done. <span style="text-align: right;">Finally <b><span style="color: #0b5394;">Save Your Template.</span></b></span> </span></div>
<div style="text-align: left;">
<span style="font-family: inherit;"><br /></span></div>
<div style="text-align: center;">
<span style="font-family: inherit;">Load
 More Post widget simply made  by using the jQuery and this can install 
very easily but adding the some simple codes, but as we said this widget
 made by jQuery you it can affect your template some where like 
javascript could be affect by this jQuery codes but don't worry it will 
not affect your other important plugins. So go and add this.</span></div>
</div>
</div>

How to Add JQuery Load More Posts OR Infinite Scrolling to Blogger

Technology is running with rocket's speed and also technology is increasing in the world of web that why we can add as much as new fea...

AddThis

Advanced Auto Scrolling Recent Posts Widget Generator For Blogger / Blogspot

How to Add JQuery Load More Posts OR Infinite Scrolling to Blogger

AddThis Smart Layers