Advertise Here


Hey guys today I going to share all in one subscription box for blogger. I myself have added it in this blog. Every blogger knows that a subscription box is important as helps the visitors to stay connected to your blog. If you create a new post on your blog the visitor who have subscribed will get an email that your blog has new content and then the visitor will visit if he/she is interested. Thus it also increases your visits and makes your visitor a reader of your blog. And so blogger must add convincing content and subscription box so that visitors might end up subscribing your blog. And if the subscription box will have a little bit social touch it will be much better. Rather than adding social buttons and subscription box as different widgets we can add a Hybrid subscription box. Here is a good subscription box by windroid club:

Steps to add this widget:

  • Go to your blogger dashboard
  • Select your blogger blog
  • Click on Layout from Drop Down menu (shown in picture)

  • A new Window appear
  • Click on Add gadget
  • And select HTML/JavaScript
  • Next Box of HTML/JavaScript will appear (shown in picture)

  • Now the box of HTML/JavaScript will appear when you click on the box.
  • Now paste the following code to add the All in one subscription widget on your blog.
<style type="text/css">
box-shadow:1px 1px 4px #dcdcdc;
-moz-box-box-shadow:1px 1px 4px #dcdcdc;
-web-kit-box-shadow:1px 1px 4px #dcdcdc;
-goog-ms-box-shadow:1px 1px 4px #dcdcdc;
border-bottom:1px solid #dcdcdc;
border-left:1px solid #dcdcdc;
border-right:1px solid #dcdcdc;
#wc-socico table

#wcsub-box .wcsub-fblike { border-bottom: 1px solid #dcdcdc; border-left: 1px solid #dcdcdc; border-right: 1px solid #dcdcdc; padding: 5px; background:#fff;}
#wcsub-box .wcsub-email {border: 1px solid #dcdcdc; background: #f8f8f8; padding:11px;}
#wcsub-box .wcsub-email h4{color: #444;font-family: Arial;font-size: 12px; margin: 0 0 10px;}
#wcsub-box .wcsub-email .txt,#wcsub-box .wcsub-email .txt:focus{background:#fff; float:left; color:#777777; border:1px solid #dcdcdc; border-radius: 3px; padding: 7px 10px 8px; width: 140px;}
#wcsub-box .wcsub-email .wcsub-button,#wcsub-box .wcsub-email .wcsub-button:focus{background:#222222; border:1px solid #222222; color:#fff; border-radius: 3px; float: right; font-size: 12px; font-weight: bold; padding:7px 3px; }
#wcsub-box .wcsub-email
input, textarea {
font-family: Georgia, "Times New Roman", Times; font-size: 1em;}

<div id="wcsub-box">
<div class="wcsub-email">
<h4>Get FREE updates on your <a href="" target="_blank" style="color:#3b5998;">Email</a> | <a href="" target="_blank" style="color:orange;">RSS</a></h4>
<form onsubmit="'', 'popupwindow',
'scrollbars=yes,width=700px,height=700px');return true" target="popupwindow" method="post" action="">
<input name="email" onblur="if (this.value == '') {this.value = 'Enter your email address';}" onfocus="if (this.value == 'Enter your email address')
{this.value = '';}" value="Enter your email address" class="txt" />
<input type="hidden" name="uri" value="Pretoproblogger" />
<input type="hidden" value="en_US" name="loc" />
<input type="submit" value="Subscribe" class="wcsub-button" />
<div style="clear:both;"></div>

<div id="wc-socico">
<table border="0" cellspacing="0" cellpadding="0" width="298">
<td valign="top" ><a href='' target='_blank' rel=nofollow' ><img id="wc-socicoimg" src="" alt="Subcribe to our RSS feeds" /></a></td>

<td valign="top" ><a href='' target='_blank' rel='nofollow'><img id="wc-socicoimg" src="" alt="Join Us on Facebook" /></a></td>

<td valign="top" ><a href='' target='_blank' rel='nofollow'><img src="" alt="Add to Circles" id="wc-socicoimg" /></a></td>

<td valign="top" ><a href='' target='_blank' rel='nofollow'><img id="wc-socicoimg" src="" alt="Follow us on Twitter" /></a></td>

<td valign="top" ><p id="wc-rscount"><a href=""><img src=";fg=ffffff&amp;anim=1" height="26" width="88" style="border:0" alt="" /></a></p></td>

<div class="wcsub-fblike">
<iframe src="// href= &send=false&layout=button_count&width=80&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowtransparency="true"></iframe><a href="" target="_blank" rel="nofollow" style="color: #3B5998; font-family: arial; font-size: 16px; font-weight: bold; line-height: 20px;"> Like us on Facebook </a><div class="clear"></div>

<a href="" class="twitter-follow-button" data-show-count="true" data-lang="en-gb">Follow @PreToProBlogger</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);;js.src=p+'://';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

<div class="wcgplus">
<div class="g-plus" data-href="" data-width="290" data-height="131" data-theme="light"></div>

  • Change all the social ids/addresses highlighted in red with your social ids/addresses
  • Leave the widget title blank.
  • Click save
You are done now.

Comment if you liked the subscription box...

Post a Comment Blogger Disqus

  1. hei i like your article ! can you follow my Google+ ?

  2. Hey Thanks For This Widget I have Applied It on My Blog Also

    Check Out eMobileDownloads


Get Free Updates...!!!