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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia2-c2u56jcRtex_x2859_o5tqN33pt6MEZ_mc9a2lniSenCxOXDaksX8A9R7ouU4izFGjPFFuTETYZPY5NgF5k6kqjZGYPy8wVtKw52kgAvZmnvE50uZmjqZ_-yW_l6rz4ASWRm7erQDl/s320/BS+Share+Button+Facebook.png) no-repeat
}
.bstweet{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgls92mz8xnCCjhDUaIityZvuVknbYZAKcqNMiIHVUAsAY4wbm7GyWkoKTSt8aGtK7t2XBU4vuYlhduRn8TcK6XtiSDYEA69UAO29UFNZ9Wp73GDKxE1ODYWdYwp-DAmMm1KBasGIIPzgq5/s320/BS+Share+Button+Twitter.png) no-repeat
}
.bsdel{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOzNYa9fWkpoBoLO0eXqfnbzeeDMzDuv9QYqdd6DZKBOYXvuzcXmFaaAB7oDAjJl7Nay3r-ubcHH-gwXtsTtG_Rag_HIvWOgESsKQsCPxgBzBk0qTTNCuNZ7x2_7ZRau9eBvhYABWuZiPi/s320/BS+Share+Button+Delicious.png) no-repeat
}
.bsstumble{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQ1iooM7u75-lnpcua0-hZ8RBgwovkBl52hINyo-NUvF-G5IgHJ73mxFk28vU6M8afwVXn8d_Sj_H1YjChV2buyBbiim3QyuFGWV25lid9a6G8jK7LrBf4_EhNqmcfXF01Wd8OniFYNjt4/s320/BS+Share+Button+Stumbleupon.png) no-repeat
}
.bsdigg{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzJj4oIAp4iAIxTvD78U4gC4DTHOGXu-IP4p3lmIlea7Q1OntXW8xWYKs3MJkoDPCYiJZdMoZ26ln6k4saWm_g41sLlLDbppc6ddb8waE2inmt-7ePlfoO9lBL3wdi-WtOHCYRG4qs52sa/s320/BS+Share+Button+Digg.png) no-repeat
}
.bsplus{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNwjUzgsvmx-1fJKrAB-x9-UR1dPKVzPln0du6EIHT3X6qYQGeG9gvralpIXss2ujMws2kaw5vW_26-uQsIM8Y0vti_WNi7PjspgoyUYU6caSN-DB1LuyFby2NKUMK8ns_bUSmyyxMz_fU/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 == "item"'>
<!-- /Social Bookmarking Buttons Beside Ad Unit by www.bloggerspice.com -->
<b:if cond='data:blog.pageType == "item"'>
<div class='ads'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'>
<td width='354'>
<!--BEGIN B4PSADS.COM ADZONE DISPLAY CODE --><script data-cfasync="false" type="text/javascript" src="http://z7602-p6458-n86.pub.pgssl.com/adv/ap/fastjs.asp?m=i&z=7602&p=6458&n=86&s=r"></script><!--END B4PSADS.COM ADZONE DISPLAY CODE --></td>
<td><div class='bsads-right-min'>
<a class='bsplus' expr:href='"http://plus.google.com/share?url=" + data:post.url' rel='external nofollow' target='_blank'>Share On Google+</a>
<a class='bsdel' expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'>Add This To Delicious</a>
<a class='bstweet' expr:href='"http://twitter.com/home?status=Reading " + data:post.title + " " + data:post.url' rel='external nofollow' target='_blank'>Tweet/ReTweet This</a>
<a class='bsfacebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'>Share on Facebook</a>
<a class='bsstumble' expr:href='"http://www.stumbleupon.com/refer.php?url=" + data:post.url + "&title=" + data:post.title' rel='external nofollow' target='_blank'>StumbleUpon This</a>
<a class='bsdigg' expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url + "&title=" + 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
0 comments:
Post a Comment