15 Sept 2012
SUBSCRIPTION BOX WITH SOCIAL NETWORKING ICONS FOR BLOGGER
Subscription Box With Social Networking Icons For Blogger
- Go To Blogger - Design
- In Page Elements choose Add a gadget
- Choose HTML/JAVASCRIPT option
And add the following code,
<div class='widget-content'>
<table align="center" width="317px" cellspacing="0px" cellpadding="1px"><tbody><tr><td><a target="_blank" rel="nofollow" href="http://www.facebook.com/tricks2Blogging"><img src="http://2.bp.blogspot.com/-qMRqkcoAT0s/Tz06uOJ0WII/AAAAAAAAAHY/
gLqbjiBuBfc/s1600/
woden+board+facebook_netoops.png" class="beintouch" /></a></td><td><a target="_blank" href="http://twitter.com/tricks2Blogging/" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwpAHmkzuxEuQJKZHbxmqndwYVfshLcZRy5XGywgn14VMrkNL4j0hOfWB713wOqGF_mciV_wYB9P6iwfOlGxvDMec9LI4IEZHHkyCDK95Mvk96CH8ZWtNLx7hGfBhlBYigm6Aw8m4Hbuk/s1600/
woden+board+twitter_netoops.png" class="beintouch" /></a></td><td><a target="_blank" href="http://feeds.feedburner.com/tricks2Blogging" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgk_koi-pUv1P14go_jKHhn9rFGbz3aUnExQo-Y1MHT9w_ZGWgnbTytIy38P2Zb-tRn6yJt72Ix8vYP_7RlbopUI3xGtVwuaL3Fk-tq0hZpQ7ZI7dKtFdNdbv_xT6hoCG7FQNo8z9F5CEQ/s1600/woden+board+RSS1_netoops.png" class="beintouch" /></a></td></tr></tbody></table>
<style type="text/css">
img.beintouch:hover{
background: none repeat scroll 0 0 #D6D6D6;
border-radius: 16px 16px 16px 16px;
box-shadow: 0 0 10px #565656;
}
.emailtext {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCsMkeZopSKLSpliAGh0uooMvBRQP-0C7N2W_ZrbVtEnss2kafQV6FIcMjHcsiSirRoVCT1XV5jtC4X4R3JGdb3uXWQHK7CRUeaK07n3TBGKzIWCWfxqnGL_eKvQN_uowWdp9ZzykOdFc/s1600/mailbox.png") no-repeat scroll 4px center transparent;
border: 1px solid #D3D3D3;
border-radius: 4px 4px 4px 4px;
box-shadow: 1px 1px 2px #CCCCCC inset;
color: #444444;
font-weight: bold;
padding: 7px 15px 7px 35px;
text-decoration: none;
width:176px;
margin-left:2px;
}
.ebutton {
background: -moz-linear-gradient(center top , #FBFBFB 0%, #F4F4F4 100%) repeat scroll 0pt 0pt transparent;
background: -webkit-linear-gradient(top , #FBFBFB 0%, #F4F4F4 100%);
background: -o-linear-gradient(top , #FBFBFB 0%, #F4F4F4 100%);
background-color:#abab12;
border-radius: 4px 4px 4px 4px;
border: 1px solid #D3D3D3;
color: #444444;
cursor: pointer;
font-weight: bold;
margin-left: -18px;
margin-top: 5px;
padding: 6px 15px;
text-decoration: none;
}
</style>
<div>Get Latest Tips via e-mail</div>
<form target="popupwindow" style="margin: 0pt;" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FreeclassifiedsAndSeoSites', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" method="post" class="emailform" action="http://feedburner.google.com/fb/a/mailverify">
<input type="hidden" value="FreeclassifiedsAndSeoSites" name="uri" />
<input type="hidden" value="en_US" name="loc" />
<input type="text" value="Enter your email..." onfocus="if (this.value == "Enter your email...") {this.value = ""}" onblur="if (this.value == "") {this.value = "Enter your email...";}" name="email" class="emailtext" />
<input type="submit" value="Subscribe" title="" class="ebutton" alt="" />
</form>
</div>
Replace The Red Green Blue Codes with your Facebook, Twitter, feed burner codes
x