Mashable Social Sharing Widget For Blogger

The best way to promote a blog is to share the content with different social sharing websites. There are different social sharing gadgets are available to expose your blog. But each of the gadget will have different codes. Te only way to get all the needed important gadgets at one place is to use the mashable gadget to your blog.

This social sharing gadget will contain facebook,twitter,google plus sharing option. And also it contains the email subscription button to get more readers to your blog. It is sure that this type of mashable social sharing widget will bring more traffic to your blog.

To get this widget follow the below steps:

1.Goto your blogger Dashboard.
2.select Layout-->Add A Gadget-->Html/Javascript.
3.Copy the following code and paste it.


<style type="text/css">
/*<!CDATA[*/
#w2b-mashable{width:300px;margin:auto;padding:0;}
.w2b-googleplus {height: 57px;}
.w2b-facebook {background:#FFFFFF;border: 1px solid #DCDCDC;margin-top: -2px;padding: 5px 10px;}
.w2b-gplusone {background-color: #f5fcfe;border: 1px solid #d8e6eb;border-top: 1px solid white;font-size: .87em;color: black;padding: 9px 0 0 11px;line-height: 24px;height:30px;}
.w2b-gplusone span {display: inline-block;vertical-align: middle;height: 20px;margin-top: -17px;font-size: 11px;font-family: "Arial","Helvetica",sans-serif;}
.w2b-twitter {background-color: #eef9fd;border: 1px solid #c7dbe2;border-top: 0;}
.w2b-twitter a.twitter-follow-button {display: block;}
.w2b-twitter iframe {margin: 9px 11px;}
.w2b-emailbox {background-color: #E3EDF4;border: 1px solid #b6d0da;border-top: 1px solid #eff5f7;padding: 12px 16px;overflow: hidden;}
.w2b-emailbox form{width:100%;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;border: 0;}
.w2b-emailbox input.emailu {float:left;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box;border: 0;color: #999;padding: 7px 10px 8px;width: 100%;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;font-size: 13px;}
.w2b-emailbox input.emailu:focus {color: #333;}
.w2b-emailbox input.submitu {-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;color: white;padding: 7px 14px;font-weight: bold;font-size: 12px;float: right;cursor: pointer;}
.w2b-emailbox input.submitu:hover {text-decoration: none;}
.w2bDefault {border: 1px solid #cc7c00;text-shadow: #d08d00 1px 1px 0;background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffca00),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: linear-gradient(center top,#ffca00 0,#ff9b00 100%);}
.w2bDefault:hover {background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffe480),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: linear-gradient(center top,#ffe480 0,#ff9b00 100%);}.w2b-moresubs {background: none repeat scroll 0 0 #EBEBEB;border-style: solid;border-width: 1px;border-color: #fff #ccc #ccc;padding: 3px 8px 3px 3px;text-align: right;font-size: 7px;letter-spacing: 1px;}
.w2b-moresubs a {display: inline-block;font-weight: bold;color: #1E598E;text-decoration: none;text-shadow: 1px 1px 1px #fff;}
/*]]>*/

</style>

    <div id="w2b-mashable">

<div class="w2b-googleplus">

   <script type="text/javascript">

/*<![CDATA[*/

window.___gcfg = {lang: 'en'};

(function(){

   var po = document.createElement("script");

   po.type = "text/javascript"; po.async = true;po.src = "https://apis.google.com/js/plusone.js";

   var s = document.getElementsByTagName("script")[0];

   s.parentNode.insertBefore(po, s);

})();

/*]]>*/

   </script>

   <div class="g-plus" data-href="https://plus.google.com/107373109090289794215" data-width="300" data-height="69" data-theme="light"></div>

</div>

<div class="w2b-facebook">

   <iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Ffacebook.com%2Fspiceupblogging&amp;send=false&amp;layout=standard&amp;width=280&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font=arial&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:280px; height:66px;" allowtransparency="true"></iframe>

</div>

<div class="w2b-gplusone">

   <script type="text/javascript">/*<![CDATA[*/

     (function() {

var po = document.createElement("script"); po.type = "text/javascript"; po.async = true;

po.src = "https://apis.google.com/js/plusone.js";

var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(po, s);

     })();/*]]>*/

   </script>

   <div class="g-plusone" data-size="medium" data-href="http://www.spiceupblogging.com/"></div>

   <span>Recommend on Google</span>

</div>

<div class="w2b-twitter">

   <a href="https://twitter.com/spiceupblogging" class="twitter-follow-button" data-show-count="true">Follow @spiceupblogging</a>

   <script type="text/javascript">/*<![CDATA[*/!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");/*]]>*/</script>

</div>

<div class="w2b-emailbox">

   <form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=spiceupblogging', 'popupwindow', 'scrollbars=yes,width=550,height=520'); return true" target="popupwindow">

<table width="100%">

   <tr>

<td>

   <input class="emailu" name="email" placeholder="Enter your email" type="text"/>

</td>

<td width="64px">

   <input class="submitu w2bDefault" type="submit" value="Subscribe"/>

</td>

   </tr>

</table>

<input name="uri" type="hidden" value="spiceupblogging"/>

<input name="loc" type="hidden" value="en_US"/>

   </form>

</div>

<div class="w2b-moresubs">

   <a href="http://www.spiceupblogging.blogspot.in/">Get this Gadget</a>

</div>

    </div>

Now replace all spice up blogging with your social sharing names.

That's all you are done...