Place Ads or Facebook Recommendation Widget beside Social Sharing Buttons Below every Blog Posts

Place Ads or Facebook Recommendation Widget beside Social Sharing Buttons Below every Blog Posts

17
data:blog.title
blogger widget

I have going to share a trick that how to place ads or Facebook recommendation Widget beside social sharing buttons below every blog posts. It is a great way to attract your visitors to make more click on ads and beside of this you can a visitors can easily share your blog posts easily. Remember more user friendly site means more returning visitors. So  I have keep this widget simple. Not only ads you can also place Facebook recommendation widget beside social sharing widget.


Step 1 Log in to your blogger account and Click on Template  ->

Step 2 Now click on 
Edit HTML-> Unfold code


Step 3 Now find ]]></b:skin> by Pressing  Ctrl + F


Step 4 And Paste the below code above ]]></b:skin> and save your template

/*****************************************
Widget by www.bloggerspice.com
******************************************/
.bsads{
margin-bottom:10px;
border-bottom:solid 1px #dedede;
padding-top:10px;
font-size:13px
}
.bsads-right-min{
border-left:solid 1px #dedede;
height:250px;
padding-left:10px
}
.bsads-right-min a:link,.bsads-right-min a:visited,.bottom-share-links a:link,.bottom-share-links a:visited{
color:#222;
display:block;
height:32px;
width:140px;
font-size:12px;
line-height:22px;
margin-top:10px;
padding-left:42px
}
.bsads-right-min a:hover,.bottom-share-links a:hover{
color:#009df2}
.bsfacebook{
background:url(http://2.bp.blogspot.com/-goFGTNmFnps/UXUA6qBJlRI/AAAAAAAAClI/WrYCS08nPAg/s320/BS+Share+Button+Facebook.png) no-repeat
}
.bstweet{
background:url(http://1.bp.blogspot.com/-tjgLZKFUa50/UXUA7WXN1mI/AAAAAAAAClc/XwshyE6l16I/s320/BS+Share+Button+Twitter.png) no-repeat
}
.bsdel{
background:url(http://3.bp.blogspot.com/-SSEh_eXFlvk/UXUA6cuFPEI/AAAAAAAAClE/e7PdQ6zy8Yg/s320/BS+Share+Button+Delicious.png) no-repeat
}
.bsstumble{
background:url(http://3.bp.blogspot.com/-giDStKwvDhU/UXUA7eyjB9I/AAAAAAAAClg/fyDGYJugJnQ/s320/BS+Share+Button+Stumbleupon.png) no-repeat
}
.bsdigg{
background:url(http://3.bp.blogspot.com/-K0xMpMY6ghU/UXUA6p2Gb6I/AAAAAAAAClA/yYMZZev7eKo/s320/BS+Share+Button+Digg.png) no-repeat
}
.bsplus{
background:url(http://3.bp.blogspot.com/-HpfXCX03aHM/UXUA7GJ4ruI/AAAAAAAAClU/mV8xu-SshZo/s320/BS+Share+Button+GooglePlus.png) no-repeat
}
.bswdt{
position:fixed;
margin-right:10px;
left:0;
top:40%
}
.bswdt img{
float:left;
clear:left;
margin:5px
}


Step 5 Now find <data:post.body/> by Pressing   Ctrl + F

Step 6 And Paste the below code above <data:post.body/> and save your template

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- /Social Bookmarking Buttons Beside Ad Unit by www.bloggerspice.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='ads'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'>
<td width='354'>
&lt;!--BEGIN B4PSADS.COM ADZONE DISPLAY CODE --&gt;&lt;script data-cfasync=&quot;false&quot; type=&quot;text/javascript&quot; src=&quot;http://z7602-p6458-n86.pub.pgssl.com/adv/ap/fastjs.asp?m=i&amp;z=7602&amp;p=6458&amp;n=86&amp;s=r&quot;&gt;&lt;/script&gt;&lt;!--END B4PSADS.COM ADZONE DISPLAY CODE --&gt;</td>
<td><div class='bsads-right-min'>
<a class='bsplus' expr:href='&quot;http://plus.google.com/share?url=&quot; + data:post.url' rel='external nofollow' target='_blank'>Share On Google+</a>
 <a class='bsdel' expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'>Add This To Delicious</a>
 <a class='bstweet' expr:href='&quot;http://twitter.com/home?status=Reading &quot; + data:post.title + &quot; &quot; + data:post.url' rel='external nofollow' target='_blank'>Tweet/ReTweet This</a>
 <a class='bsfacebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'>Share on Facebook</a>
 <a class='bsstumble' expr:href='&quot;http://www.stumbleupon.com/refer.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'>StumbleUpon This</a>
 <a class='bsdigg' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'>Digg This</a>
  </div></td></table></div>
</b:if>
<!-- /Social Bookmarking Buttons Beside Ad Unit by www.bloggerspice.com --></b:if>



Customization 

  • Change height:250px; to increase or decrease widget Height
  • Change width='354' for increase or decrease Ads width 
  • Change color:#009df2 for changing the Link Hover Color
  • Replace Your Ads Parsed Code or Facebook Recommendation Widget Code Is Here with your ads code or Facebook recommendation code.
You can Parse your ads code By HTML Encoder
Place Ads or Facebook Recommendation Widget beside Social Sharing Buttons Below every Blog Posts
4 Stars stars - "Place Ads or Facebook Recommendation Widget beside Social Sharing Buttons Below every Blog Posts" I have going to share a trick that how to place ads or Facebook recommendation Widget beside...

Post a Comment

Jaker Khan 4/23/2013

fantastic widget..thanks I am grateful to u..

error in ads space.

what error have you got..kindly share with us..

Hello Brother Something Is Wrong In The Script ........Please Check And Fix It Soon Because It Is Not Getting Save ............Regards from latest games and software

Nauman I have corrected the code you can use it now..thanks for your comment..

Hello Again brother please add this as important before adding ads......parse your ads html script before adding into template......thank you regards from latest games and software...........or http://www.latestgames2.blogspot.com/

and one more thing brother I have just scrolled down to your footer few seconds ago.....i loved that colorful menu .......please i want the exact same menu bar for my blog please share with me if possible.....thank you and who is the second author of your site.....................from India your bro...?????

Hopefully I will share it soon for all of my visitors..And Dixit is from India he has recently joined in my site to share some new articles. He is now Co-author of my site because he has fulfill some criteria to become co-author.

please brother inform me when you share menu bar script.thank you regards from your loyal visitor and hopefully friend........

hey hello bro i'm proud to be a loyal reader of this site ...so please accept my personal request .......i want that blue shiny color around your site...exactly the same.......so please accept my request and reply as soon as possible .....

bro its require different coding according to templates base coding. But I am releasing soon just like my template..but confuse which color should I select as base color? kindly suggest me.

please base color should be blue...............i love this color and it will match every template..........

my co-author suggesting me Black+White+Dark Red

hi.... i am not getting like button and members who liked me what's the problem

here you can add Facebook recommendation box..please visit the below link for tutorial

http://www.bloggerspice.com/2013/03/facebook-recommendation-box-to-engage_8.html

This code does not work in my site http://trickybadsha.blogspot.com

my email id- badsha.aiemd@gmail.com

Hi Badsha what error have u got on this widget?

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form

Name

Email *

Message *