How To Add Mega Social Subscription widget to blogger
Friends social subscription widget is most important widget for blog to increase traffic. This guide is about adding a mega social subscription widget box to your blogger blog.This widget contains social subscription buttons, email subscription box, Facebook like box, twitter followers, Google plus subscription and much more.
Log in to Blogger
<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:#444444 ;
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:#E98313;
border:1px solid #E98313;
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:#686B6C;
border:1px solid #686B6C;
}
.textarea{
padding:2px;
margin:6px 2px 6px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
width:170px;
color:#666;}.social-widget
{
width:298px;
border:1px solid #d7d7d7;
}
.social-widget img
{
padding:10px 10px 2px 2px;
}/*]]>*/
</style>
<div id="soc-mega">
<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=masterhacksindia', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == "") {this.value = "Enter email address here";}" onfocus="if (this.value == "Enter email address here") {this.value = "";}" value="Enter email address here" type="text" />
<input type="hidden" value="masterhacksindia" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="soc-emailsubmit" value="Submit" type="submit" />
</form>
</div><div class='social-widget'>
<a href='http://feeds.feedburner.com/masterhacksindia' 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/masterhacksindia' 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/arunjohnson001' 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/u/0/109278971237541628404' 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/arunjohnson001' 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/arunjohnson001" class="twitter-follow-button" data-show-count="true">Follow @windroidclub</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="soc-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/u/0/109278971237541628404" data-width="300" data-height="69" data-theme="light"></div>
</div><div class="soc-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.masterhacksindia.blogspot.com/"></div>
<span>Recommend on Google</span>
</div>
<div class="soc-facebook">
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fmasterhacksindia&send=false&layout=standard&width=280&show_faces=true&action=like&colorscheme=light&font=arial&height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:280px; height:66px;" allowtransparency="true"></iframe>
</div>
</div>
Features:
- Email Subscription Box.
- Social Buttons for RSS, Facebook, Twitter, Google plus,and YouTube Subscriptions.
- Twitter Followers buttons with follower count.
- Facebook like Box.
- Add to Google circles box.
- Recommend on Google Plus button.
Leave a comment below………………………..
No comments: