New social subscribe widget for blogger

Kumusta! Today I am going to share a cool new social subscribe widget for blogger. This social sharing tool includes Facebook, Twitter, RSS, and Google plus. The icons look like drawn from crayons which is cool, above it is a mail box! It is simple and attractive, I am sure with this widget you will get more subscribers.

A demo of this tool can be seen on this very blog, I have replaced my old social subscribe widget because it is already been used by many bloggers.

Installation

As always installing blogger widgets here at FH2M is very easy. All you need to do is go to your blogger layout and click > add gadget > choose HTML/Javascript and add the codes below.

<a href="http://feeds.feedburner.com/FromHobby2money" imageanchor="1" style="margin-left: .5em; margin-right: 1em; float: center;" rel="nofollow" target="blank"><img border="0" height="40" src="http://www.sassyandgeorge.com/wp-content/uploads/2011/01/subscribe2-copy.jpg" width="290" /></a>
<style>
.mbtips-email{
background:Fff no-repeat 0px 12px ;
width:250px;
float:center;
font-size:1.4em;
font-weight:bold;
margin:2px 20px 0px 35px;
color:#686B6C;
}
.mbtips-emailsubmit{
background:#0084CE;
cursor:pointer;
color:#fff;
border:none;
padding:3px;
margin:0 0 0px 0;
text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25);
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
font:12px sans-serif;
}
.mbtips-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px;
margin:0px 2px 0px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); font-size:13px;
width:170px;
color:#666;}
</style>
<style class="text/css">
.center
{
text-align:center;
font-weight:bold;
margin:10px;
}
</style>
<div class="center">
Submit your Email Address to Get Free Blogger Tips Directly to your Inbox
</div>
<div class="mbtips-email">
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=FromHobby2money', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if undefinedthis.value == &quot;&quot;) {this.value = &quot;Enter email address here&quot;;}" onfocus="if undefinedthis.value == &quot;Enter email address here&quot;) {this.value = &quot;&quot;;}" value="Enter email address here..." type="text" />
<input type="hidden" value="FromHobby2money" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="mbtips-emailsubmit" value="Submit" type="submit" />
</form>
</div>
<style class="text/css">
table
{
border-bottom: 0px solid #E6E6E6;
float: center;
width: 240px;
margin:10px 0 0 15px;
}
.subicons
{
border-right: 1px solid #E6E6E6;
}
.Fadeout {
filter:alphaundefinedopacity=100);
opacity: 1.0;
border:0;
}
.Fadeout:hover{
filter:alphaundefinedopacity=80);
opacity: 0.8;
border:0;
}
</style>
<div class="table">
<table>
<tr>
<td><div class="subicons"><a class="Fadeout" href="http://www.facebook.com/pages/FromHobby2Money" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="http://3.bp.blogspot.com/-czBbDmQRQhQ/TvCTKhaK4zI/AAAAAAAAAZY/E_fHny3fDBs/s1600/facebook-48.png" /></a></div></td><td><div class="subicons"><a class="Fadeout" href="http://twitter.com/dadhust" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="http://4.bp.blogspot.com/-k5cV1pvQp4g/TvCTMHqoxZI/AAAAAAAAAZs/hYpUi-qzKaw/s1600/twitter-48.png" /></a></div></td>
<td><div class="subicons"><a class="Fadeout" href="http://feeds.feedburner.com/FromHobby2money" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="http://1.bp.blogspot.com/-tANmA_fOkTk/TvCTLg2BGvI/AAAAAAAAAZk/vE6qGJK50t8/s1600/rss-48.png" /></a></div></td>
<td><a class="Fadeout" href="https://plus.google.com/118431186284938329492/posts" imageanchor="1" target="_blank" rel="nofollow"><img border="0" src="http://3.bp.blogspot.com/-H-LHpGxfe5k/TvCTLL3ovmI/AAAAAAAAAZc/AT2pMexo7RE/s1600/google-48.png" /></a></td>
</tr></table>
</div>

Customize

• Replace FromHobby2money with your own feedburner username they appear 4 times on this widget.
• Replace FromHobby2Money with your facebook fan page username.
• Replace dadhust with your Twitter username.
• Replace 118431186284938329492 with your Google plus profile ID.
• If you want to change the width of the widget, you can edit this to fit perfectly on your blogger sidebar. Change this 240px.