Share This Article Widget For Blogger Blog
You must have seen the Share This Article! Blogger Widget on my blog posts. If you didn't notice it then it is present just above the posts . Recently I got requests for some of the blog readers to publish a post explaining how to add the Share This Article gadget to their blogger blog. This is a very simple blogger plugin and is very effective as well. All you have to do is read the instructions given below and paste some code in the blog template.
Before you start, do check some of the other wonderful widgets for your blogger blog
To add the widget to your blogspot blog, visit the Design section of your blog and click on Edit HTML and click on Expand Widget Templates. Now search for data:post.body in the template and paste the following code just above it.
<b:if cond='data:blog.pageType == "item"'>
<div style='background-color:#f3f3f3; width:300px; height:200px; float:right'>
<br/><br/>
<div style='clear: both; text-align: center;'>
<h4 style='color: #208ACB; '><span style='font-size: x-large;'><b><b>Share This Article!</b></b></span></h4>
<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
<script src='http://www.stumbleupon.com/hostedbadge.php?s=5'/>
<div style='float:left; margin-left:3px;'>
<script type='text/javascript'>
digg_url="<data:post.url/>";
</script>
<script src='http://widgets.digg.com/buttons.js' type='text/javascript'/>
</div>
<a class='DiggThisButton DiggLarge'/>
<a class='google-buzz-button' data-button-style='normal-count' href='http://www.google.com/buzz/post' title='Post on Google Buzz'/>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'/>
</div>
</div>
</b:if>
You can change the code in bold text according to your blog template. If you want to change the background colour, then change the hexadecimal value of "background-color:#f3f3f3" . You can also change the width and height of the widget by changing their values. If you want to change the colour of the "Share This Article" text, then change the value of "color: #208ACB".
You can also add the social bookmarking widget of your choice by adding the code above or below the tweetmeme or stumble upon code, whichever is suitable to you.
Now click on the Save Template button and check your blog. Remember that this widget will be visible only on the post page. I hope that you found this post useful.
0 comments: