Home » Guest-Post » How-To » Recommended Post Slide Out For Blogger (New)

Recommended Post Slide Out For Blogger (New)

To keep 1st time visitor, A blogger use different types of Tricks. Related post pattern is old idea. Now a days recommended post slider is most popular. I think this is a powerful method for a blogger to keep his traffic. If you want the reader keep surfing in your blog then recommended post slider is highly necessary. You might noticed this blog is also using recomanded post slide out. Now i show you updated version of recommended post slider including social share buttons. You can customize like changing widget color and set widget position you want to show. Also use twitter share button, facebook like button and google+ button. I think it’s a total package!!!!

Demo Of The Slide Out:

Click the following link and scroll down your mouse to the bottom. Link

How To Ad Recommended Post Slide Out For Blogger

<br />
<div id="bpslidein" style="display:none;">
<div class="help">
?</div>
<div class="expand">
+</div>
<div class="close">
X</div>
<p>
Recommended for you</p>
<div id="bpslidein_image">
</div>
<div  id="bpslidein_title">
Loading..</div>
</div>
<script> if(document.location.href.split("/").length==6&&document.location.href.indexOf(".html")!=-1){if(typeof bp_onload_queue=='undefined')var bp_onload_queue=[];if(typeof bp_dom_loaded=='boolean')bp_dom_loaded=false;else var bp_dom_loaded=false;if(typeof bp_async_loader!='function'){function bp_async_loader(src,callback,id){var script=document.createElement('script');script.type="text/javascript";script.async=true;script.src=src;script.id=id;var previous_script=document.getElementById(id);if(previous_script)if(previous_script.readyState=="loaded"||previous_script.readyState=="complete"){callback();return}else{script=previous_script}if(script.onload!=null)previous_callback=script.onload;script.onload=script.onreadystatechange=function(){var newcallback;if(previous_script&&previous_callback)newcallback=function(){previous_callback();callback()};else newcallback=callback;if(bp_dom_loaded){newcallback()}else bp_onload_queue.push(newcallback);script.onload=null;script.onreadystatechange=null};var head=document.getElementsByTagName('head')[0];if(!previous_script)head.appendChild(script)}}if(typeof bp_domLoaded!='function')function bp_domLoaded(callback){bp_dom_loaded=true;var len=bp_onload_queue.length;for(var i=0;i<len;i++){bp_onload_queue[i]()}}bp_domLoaded();bp_async_loader("http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js",function(){bp_async_loader("http://samazgor.github.com/blogger-widgets/recommended-post-slider-with-fb-twitter.js",function(){},"bp-out-slide")},"jQueryjs")} </script> <a href="http://sam.azgor.com/" target="_blank"><img src="https://lh4.googleusercontent.com/-3ZeBFGQpJLA/Tu3juLKG8EI/AAAAAAAACTs/9CxWgQBV9G8/I/bloggerplugins.png" alt="Recommended Post Slide Out For Blogger" /></a>

Now i am telling you how to add recommended post slider widget in to your blogspot blog

Click "Add to Blogger” button.Select your blog and click "Add Widget"
Now go to Dashboard >Design » Edit HTML » Expand Widget Templates
Find out (CTRL+F)

<data:post.body/>

Below it, add this code and save your template.

<b:if cond='data:blog.pageType == "item"'>
<div style='display:none' id='bpslidein_place_holder'></div>
</b:if>

Your work has been done!!! When a reader scrolls down then the pop up recommended post slider open up. I also use recommended post slider for some of my blogs. If you enjoy this widget, got benefit from this post then drop a comment and share it to your friend.