How to Add StumbleUpon Button in Website or Blog?

StumbleUpon is a very popular bookmarking site. If you stumble your blog or website or if the reader of your site do it, then definitely you'll get a traffic boost. This site is very helpful to drive traffic on your blog.

But nobody like to stumble your page by copying link from your site and paste it into StumbleUpon.com. And this is not logical too. 

So what should you do? You can place a html code in your page. So that you or someone else can easily stumble your posts. It is as easy as placing a html code. Let's try.

1. If your blog is powered by blogger then sign in to it. Then go to the design option. Then hit on layout button. Now you'll find several Add a Gadget button. Hit a button where you wanna place the stumble upon button. (If your site is powered by WordPress or any other CMS then follow the steps that let you add the html code on your page.)
2. Then you'll see a list of gadgets to be placed on your blog. Choose HTML/ Java Script. 
3. Here you'll find two boxes. One is for name and another is for content. Don't write any name of this gadget. Just copy and paste the below code in the content box. 
4. Now save this window and then hit on Save Arrangement button. 
5. Then click on View Blog button and see the result. 

<!-- Place this tag where you want the su badge to render --> 

<su:badge layout="5"></su:badge>  <!-- Place this snippet 

wherever appropriate --><script type="text/javascript">   

(function() {       var li = document.createElement('script'); 

li.type = 'text/javascript'; li.async = true; li.src = window.location.

protocol + '//platform.stumbleupon.com/1/widgets.js'; var s 

= document.getElementsByTagName('script')[0]; s.parentNode.

insertBefore(li, s);   })();   </script>

This code will create a button