Stumble Upon Count Buttons for Blogger

stumbleupon-counter-for-blogger Like all other Social networks, StumbleUpon has also got some really elegant sharing buttons. StumbleUpon has got 6 different  sharing buttons.  You can choose any of these six. Integrating this into your blogger blog will require some template Edits.

image

How to add the Stumble Upon Counter Button  to Blogger?

1. First of all pick one of these 6 Button Styles.

2.Now Login to your Blogger Template and navigate to Design   >  Edit HTML and click on the check box which says “Expand Widget Templates”

3. Look for <data:post.body/> and immediately above it paste the following code.

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

4.Save the Template and you will see a vertical Stumbleupon counter(style 5) on your post. In the code above, you can change s=5 to s=1 or s=2 or s=3 or s=4 or s=6 to get the other button styles.

5. If you need the counter on every page, then remove the two lines of code in Green Color.

6. If you want the button to appear on the left side, then change float:right to float:left

7 comments :

  1. I tried it but failed, I suppose! I don't find the stumble button in there! Can you please help? Thanks :)

    ReplyDelete
  2. Thanks....now it is working! I just changed its placement from right to left. Wow! great!

    ReplyDelete
  3. I like the way you have all four button arranged off to the right of the post title. Very clean and convenient.

    ReplyDelete
  4. Agreed! I would love to see a post on how to arrange the various float counters!

    Great site!

    ReplyDelete
  5. How did you make your stumble upon button go below the FB and Twitter Buttons?

    ReplyDelete
  6. The button does not show up. Will it only appear on new posts?

    ReplyDelete