Simple Email and Social Networking Sites Subscription Widget for Blogger Blog

Kumar Info City
0
1) Login to Blogger account
2) Go to Layout
3) Go to Add gadget
4) Go to HTML/Javascript
5) Copy the below code and paste it inside the content box and save it
<style type="text/css">

/*<!CDATA[*/

#soc-mega{width:300px;margin:auto;padding:0;}

.soc-googleplus {height: 57px;width:300px;margin-top:-2px;}

.soc-facebook {background:#ffffff;border: 1px solid #DCDCDC;margin-top: -2px;padding: 5px 10px;}

.soc-gplusone {background-color: #ffffff;border: 1px solid #d8e6eb;border-top: 1px solid white;font-size: .87em;color: black;padding: 9px 0 0 11px;line-height: 24px;height:30px;}

.soc-gplusone span {display: inline-block;vertical-align: middle;height: 20px;margin-top: -17px;font-size: 11px;font-family: "Arial","Helvetica",sans-serif;}

.soc-twitter {background-color: #ffffff;border: 1px solid #c7dbe2;border-top: 0;}

.soc-twitter a.twitter-follow-button {display: block;}

.soc-twitter iframe {margin: 9px 11px;}

.soc-email{

background:#0084CE ;

width:100%;

padding:10px 0 10px 0;

float:left;

font-size:18px;

text-align:center;

font-weight:bold;

margin:0 0 20px 0;

color:#ffffff;

}

.soc-emailsubmit{

background:#787878;

border:1px solid #989898;

cursor:pointer;

color:#fff;

padding:3px;

-moz-border-radius:6px;

-webkit-border-radius:6px;

border-radius:6px;

font:14px sans-serif;

}

.soc-emailsubmit:hover{

background:#303030;

border:1px solid #989898;

}

.textarea{

padding:2px;

margin:6px 2px 6px 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;}

.social-widget

{

width:300px;

border:1px solid #d7d7d7;

}

.social-widget img

{

padding:10px 10px 2px 5px;

}

/*]]>*/

</style>

<div id="soc-mega">

<div class='social-widget'>

<a href='http://feeds.feedburner.com/btuition' target='_blank'><img src="http://3.bp.blogspot.com/-2s-dIcOf860/UN18aeew9iI/AAAAAAAAAq8/iWLQCguyKEE/s1600/rss.png" alt="Subcribe to our RSS feeds" /></a>

<a href='http://www.facebook.com/kumarafu' target='_blank'><img src="http://3.bp.blogspot.com/-XN61PbeLj9Y/UN18Xav8YLI/AAAAAAAAAqs/RitGLNDI_0c/s1600/fbook.png" alt="Join Us on Facebook" /></a>

<a href='https://twitter.com/kumarafu' target='_blank'><img src="http://1.bp.blogspot.com/-WlrYBnt_sw8/UN18btqoflI/AAAAAAAAArE/d5ciYvTY3Y0/s1600/twit.png" alt="Follow us on Twitter" /></a>

<a href='https://plus.google.com/112028974114438578103' target='_blank'><img src="http://2.bp.blogspot.com/-BWfJNYrfvnU/UN18Yj-SHVI/AAAAAAAAAq0/3_IZROJpjeE/s1600/gplus.png" alt="Add to Circles" /></a>

<a href='http://www.youtube.com/user/kumarafu333' target='_blank'><img src="http://4.bp.blogspot.com/-_JKenr0wlvo/UN2RkgZkD7I/AAAAAAAAAro/qxN9zzQaKU0/s1600/ytube.png" alt="Watch us on Youtube" /></a>

</div>

<div class="soc-twitter">

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

     <script type="text/javascript">/*<![CDATA[*/!functionundefinedd,s,id){var js,fjs=d.getElementsByTagNameundefineds)[0];ifundefined!d.getElementByIdundefinedid)){js=d.createElementundefineds);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBeforeundefinedjs,fjs);}}undefineddocument,"script","twitter-wjs");/*]]>*/</script>

 </div>

<div class="soc-email">

Get Free Tutorials via Email

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

<input gtbfieldid="3" class="textarea" name="email" onblur="if undefinedthis.value == "") {this.value = "enter email address here";}" onfocus="if undefinedthis.value == "enter email address here") {this.value = "";}" value="Enter email address here" type="text" />

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

<input class="soc-emailsubmit" value="Submit" type="submit" />

</form>

</div>

</div>

?

Now change the Feedburner, Facebook, Twitter, Google+ and YouTube user id.

Save your widget and you're done!

Post a Comment

0Comments

Post a Comment (0)