How to Add StumbleUpon Share Button For Blogger

Like all other Social networks, Stumbleupon has released some really great looking sharing buttons.

Stumbleupon has got 6 different sharing buttons.
Integrating this into blogger will require some template edits.
To add this widget to blogger, follow these instructions:




Step 1:
Log in to Blogger, go to Design / Layout > Edit HTML and tick the "Expand Widget Templates" checkbox.




Step 2:
Now find (CTRL+F) this in the code:



<data:post.body/>

Case 1:

Going for style 5.


To place the stumbleupon share button at the top right corner of your post paste this code before/above it :



<div style="float:right;padding:4px;">
<script expr:src='"http://www.stumbleupon.com/hostedbadge.php?s=5&amp;r=" + data:post.url'/>
</div>

NOTE: Don't forget to save the template.
NOTE: To change the button position from "Top-Right" to "Top-Left" just change the float position to left. i.e. float:right changes to float:left check it in Case 2 below.

Case 2:


To place the stumbleupon share button at the top left corner of your post paste this code before/above it :



<div style="float:left;padding:4px;">
<script expr:src='"http://www.stumbleupon.com/hostedbadge.php?s=5&amp;r=" + data:post.url'/>
</div>

NOTE: Don't forget to save the template.
NOTE: Now to change the button style (text in green). In the code above, change s=5 to s=1 or s=2 or s=3 or s=4 or s=6 to get the other button styles. Check it in case 3 and case 4 below.


Case 3:

Going for style 2.


To place the stumbleupon share button at the top right corner of your post paste this code before/above it :



<div style="float:right;padding:4px;">
<script expr:src='"http://www.stumbleupon.com/hostedbadge.php?s=2&amp;r=" + data:post.url'/>
</div>

NOTE: Don't forget to save the template.

Case 4:

Going for style 6.


To place the stumbleupon share button at the top right corner of your post paste this code before/above it :



<div style="float:right;padding:4px;">
<script expr:src='"http://www.stumbleupon.com/hostedbadge.php?s=6&amp;r=" + data:post.url'/>
</div>

NOTE: Don't forget to save the template.
This will put a stumbleupon share button to every post. But you won't be able to choose which post you want to include or exclude the button.

Check For More Social Share Buttons "How to add Linkedin Share, Yahoo Buzz, Reddit, Facebook Like, Delicious, Google Buzz, Digg, Tweet, Retweet and Facebook Share buttons in blogger."