Beautiful All In One Social Subscribe Widget For Blogger

Kumar Info City
0
Hello bloggers, Welcome back to here, Adding social media widgets on your blog is a way of driving more visitors from social media sites such as Facebook, Twitter, Google+, etc,. Subscribe button will bind you with your customers for long time through email subscription. When someone enters to your blog if they want to connect with your blog, this widget will help them to subscribe in all the social networks.

Beautiful All in one Social Subscribe widget contains icons of most popular social media networks with your fanpage URL, Google+ button, Facebook like button with number of likes, Twitter follow button to get more followers and feedburner email subscribe box. All these features present in a single widget. Get constant number of visitors via social networks.

Let me explain how to add this Beautiful all in one Social Subscribe widget to blogger blog. Follow the steps given below.
  • Login to your Blogger account
  • Go to dashboard and move on Layout section
  • Click on Add a gadget link and select HTML/JavaScript option
  • Copy the below code into HTML box
<style>
#socialwidget {
border: 1px solid #ebebeb;
width: 300px;
}
.Trickstoo-social{
padding: 10px 10px 10px 10px;
border-bottom: 1px solid #ebebeb;
}
.Trickstoo-social img:hover{opacity:0.8}
.googleplus {
background: #ffffff;
border-top: 1px solid white;
border-bottom: 1px solid #ebebeb;
font-size: 12px;
color: #000;
padding: 9px 11px;
ine-height: 1px;
font-family: Verdana, Geneva, sans-serif;

.googleplus span {
color: #000;
font-size: 11px;
position: absolute;
margin: 9px 70px;
width: 310px;
}
.g-plusone {
float: left;
}
.twitter {
background: #ffffff;
border- bottom: 1px solid #ebebeb;
padding: 10px;
}
.Trickstoo {
background: #ffffff;
border-top: 1px solid white;
font-size: 12px;
color: #000;
padding: 9px 11px;
line-height: 1px;
font-family: Verdana, Geneva, sans-serif;
}
.Trickstoo span {
color: #000;
font-size: 11px;
position: absolute;
margin: -12px 100px;
width: 310px;
}
#widgetbox .author-credit a {
font-size: 10px;
font-size: 10px;letter-spacing: 1px;
color: #1E598E;
text-decoration: none;
}
.email-subscribe-emailbox {
padding: 5px 10px;
font- family: "Arial","Helvetica",sans-serif;
border-top: 0;
border-image: initial;
height: 42px;
background: #EFF8FB;
width: 280px;

.email-subscribe-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;}
.email-subscribe-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;}
.email-subscribe-emailbox input.emailu:focus {color: #333;}
.email-subscribe- 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;}
.email-subscribe-emailbox input.submitu:hover {text- decoration: none;}
.TrickstooDefault {border: 1px solid #dedede;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%);}
.TrickstooDefault: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%);}
</style>
<div id="socialwidget">
<div class="Trickstoo- social">
<center>
<a style="margin-right: 10px;" href="http://facebook.com/kumarinfocity" target="_blank" rel="nofollow">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQnXTqfbMRoYCGD6ZQhu9mrie1rlKCG7d6wAVlFESzIWYDg7USsTzUYBGfOV0jys2uZAB3rLnjZbK5IK2ye0bzUartLLQxKQugum85JMxLHnsZcPpPFWg_YFtJfwr0R5Tcdht4zvSin9I/s1600/facebook.png" title='Facebook'/></a>
<a style="margin-right: 10px;" href="http://twitter.com/kumarinfocity" target="_blank" rel="nofollow">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNtWP_K3MqQCfbqufe7z2XW0L563pWQBnmtg3aWCJn-IL7Uqb6Z2K3NgGLr8r0BScGAoKJHFg-srpwIQ3NlHjJ-VUqYnmpM5fdo9K46hPpG1j6Q4h5UBJvfG9BJSlDHypyLSfivcDhSVA/s1600/twitter.png" title='Twitter'/></a>
<a style="margin-right: 10px;" rel="me" href="https://plus.google.com/112028974114438578103" target="_blank">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgB-ePvApnn9FggZdgT6S_8jKjS7VD9G1-9YEAt3uBO51arayOokdOD9QKKcZGviixtWSRGZJN1kQe5vPvgcZxqyCerzrVLV35XKJh4_e9ZImGMxYhcGfkUi8HqGUSOIEQ8S9r-xtzQwQM/s1600/gplus.png" title='Google Plus'/></a>
<a style="margin- right: 10px;" href="http://pinterest.com/shanmugammist/" target="_blank">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqJ-9WJdee_NRkUOutYpPH5TzCTGoAF-To-MuazFyHFDE0REq2zpRse-FtT7hsF7hgLvwMeELA76lLyIGWS-0ojgTHD3iq-NjVwdp03KNNOnE2_P4AlsVesjPKxeiooHHD97FEc4MORuI/s1600/pinterest.png" title='Pinterest'/></a>
<a style="margin-right: 10px;" href="http://feeds.feedburner.com/trickstoo" target="_blank" rel="nofollow">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnWZH7_D1ktuKVKP29Y5EsjaWLtGhoiM7Yqct9hZ2gciR-ZkFtwGyY5eRvlbZKSnoPpXdpJyAkePxz2uuM5k-yWwqWtAsFrMnN_YyVbbsGhPYi2skKIo8BbwET7pvR2cFQTg3ee-n5FJQ/s1600/rss.png" title='RSS Feed'/></a>
</center>
</div>
<div class="googleplus">
<span><font><font>Recommend Us On Google </font></font></span>
<!-- GooglePlus -->
<g:plusone size="medium" href="http://kumarinfocity.blogspot.in/"></g:plusone>
<script type="text/javascript">
(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>
<div class="Trickstoo">
<!-- facebook -->
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Ffacebook.com%2Fkumarinfocity&amp;send=false&amp; layout=button_count&amp;width=450&amp;show_faces=true&amp; action=like&amp; colorscheme=light&amp;font=verdana&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowtransparency="true">
</iframe>
<span>Like Us On Facebook</span>
</div>
<div class="twitter">
<!-- Twitter -->
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://platform.twitter.com/widgets/follow_button.1335513764.html#_=133552810175 5&amp;id=twitter-widget-0&amp;lang=en&amp;screen_name=kumarinfocity&amp;show_count=true&amp;show_screen_name= true&amp;size=m" class="twitter-follow-button" style="width: 244px; height: 20px; " title="Twitter Follow Button">
</iframe>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
</div>
<div class="email-subscribe-emailbox">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=kumarafu333', 'popupwindow', 'scrollbars=yes,width=550,height=520'); return true" target="popupwindow">
<table width="100%">
<tr>
<td>
<input class="emailu" name="email" placeholder="Enter email address" type="text"/>
</td>
<td width="70px">
<input class="submitu TrickstooDefault" type="submit" value="Subscribe"/>
</td>
</tr>
</table>
<input name="uri" type="hidden" value="kumarafu333"/>
<input name="loc" type="hidden" value="en_US"/>
</form>
</div>
<div id="widgetbox" style="background: #EBEBEB;border-top: 1px solid #ddd;padding: 1px 8px 1px 3px;text-align: right;border-image: initial;font- size:10px;font-family: "arial","helvetica",sans-serif;">
<span class="author-credit" style="font-family: Arial, Helvetica, sans- serif;"></span>
</div>
</div>

You Must do it
  • Replace shanmugam39 with your Twitter Username.
  • Replace trickstoo with Username of your Facebook fanpage.
  • Replace trickstoo with your FeedBurner Username.
  • Replace shanmugammist with your Pinterest Username.
  • Replace http://www.trickstoo.com with your Blog Address.
  • Replace 112028974114438578103 with Google+ ID of your fanpage.

Post a Comment

0Comments

Post a Comment (0)