force visitors to subscribeaToday we will not just learn how to create a new eye-catching subscription box but we will get into some Email List tactics that you should learn in order to turn Every Visitor into a Reader. A Blog with no readership equals a body with no soul. Nothing matters more at least for me than readers who read, share and circulate your content. Revenue and advertisements are secondary elements of blogging but what counts a lot is your strong Email List. 



The more readers you have, the less dependent you get on search engines and more attractive you become to advertisers. The first thing that any sponsor sees is your total blog subscribers may that be from Feedburner, Twitter, Facebook or our new GOOGLE+. People will choose the option that is most flexible to them. So are you offering an easy and flexible method for your visitors to receive your daily updates? Of course most of you do but you often under-estimate one Magic tip! That is the design and Position of your subscription box.

Live Demo

How To Increase Blog Subscribers?

The answer to this question is simple. Place your subscription box right at the top just below header and above all advertisements. You can clearly see it on my blog. I could have shifted the BSA ads to the Top right but instead we added the RSS Email form above all advertisements because we know the worth of a reader. The first section that loads on a any browser is your Blog header and then elements just below it. This is the magic position which attracts a visitor's attention the most plus it is one region that has the highest page impressions. Sponsors pay a lot for this Top Right Position on a Blog sidebar and then reason as I mentioned is to force the visitor to notice and click the Ad.
If you take a tour of famous blogs, you will observe that almost everyone is using the same Top-Right Position for placing their Subscription box. I would highly recommend that you make this new shift as soon as possible. It's the only effective way to grow your Email list.

What Must a Subscription Box Contain?

Your subscriber's form may not just contain links to your RSS Feed and a RSS Email form. You should add all your social media profiles to it. Its like providing the visitor with multiple choices of subscription. Normally we choose the biggest giants like Facebook, Twitter and now indeed Google+. A complete subscriber Form contains RSS option along with social media buttons. 

How to create a Subscription Box?

If that is your question then I guess you have landed at the right place. We have so far designed various combinations of Subscriber Boxes and you can find our free old versions by visiting the link below,
Lets now create another cool widget that will blend perfectly on blogs that prefer simplicity and less-bright colors. This widget is compatible with all major browsers including IE8. I have used conditional statements to make it work perfectly with IE8.
Follow these easy installation guide.
  1. Go To Blogger > Design
  2. Select HTML/JavaScript gadget
  3. Add the follow code inside it
<style type='text/css'>
.mbt a{
    color: #6e6e6e;
    font: bold 12px Helvetica, Arial, sans-serif;
    text-decoration: none;
    padding: 7px 12px;
    position: relative;
    display: inline-block;
    text-shadow: 0 1px 0 #fff;
    -webkit-transition: border-color .218s;
    -moz-transition: border .218s;
    -o-transition: border-color .218s;
    transition: border-color .218s;
    background: #f3f3f3;
    background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
    border: solid 1px #dcdcdc;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}
.mbt a:hover {
    color: #333;
    border-color: #999;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.mbt a:active {
    color: #000;
    border-color: #444;
}

.mbtbar{ width:280px; float: left; margin-left:3px; margin-top:5px; padding:0;}
.mbtbar .emailsub{border-bottom: 0px solid #e6e6e6; padding: 0px 0 15px 0; float: left; width: 100%; font-family: Helvetica, Arial;}
.mbtbar .emailsub .emailupdatesform{width: 100%; float: right; padding:0px;}
.mbtbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 0px 8px; color: #989898; font-size: 14px;  width: 130px; height:30px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}
.mbtbar .emailsub .emailupdatesform input.emailupdatesinput:hover{
border-color: #999;
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}

.mbtbar .emailsub .emailupdatesform input.joinemailupdates:hover{ border-color: #666; 
    -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2)
    -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); cursor:pointer;
}
.mbtbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 10px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}

.mbtbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 0px 8px; color: #989898; font-size: 14px;  width: 145px; height:28px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}
.mbtbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 0px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}
</style>

<!--[if IE 8]> <style>
.mbtbar .emailsub .emailupdatesform input.emailupdatesinput{background: #F3F3F3;  float: left; border: 1px solid #dcdcdc; padding: 5px 10px; color: #989898; font-size: 12px;  width: 130px; height:18px;   border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;}
.mbtbar .emailsub .emailupdatesform input.joinemailupdates{
border: solid 1px #dcdcdc;
    background: #F3F3F3;
   font-family:Helvetica, Arial;
text-transform: none; color: #989898; height: 25px; padding: 0 5px; margin: 0 0 0 5px; font-weight:bold; font-size:14px; height:30px;
  border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
}


</style> <![endif]-->


<div class="mbt" style="padding: 0pt 0pt 0pt 5px;">
<table><tbody><tr>
<td>
<a   href="ADD-FEEDBURNER-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgURRooVbgBPCSlzkbHcq_4lthtG77yx8ttPG3BwfrnRhJuq0qvp8fX69Kw4s0BUWL_83kKl2usm1XccY2Xv7rixLeU2_THJjgcxfhq4JM0psc2Y8qC7SjQUaDHQgZAua7IW7ji1flknHk/s1600/rss.png" border="0"></a>
</td>
<td>
<a style="margin-left:5px;"href="ADD-TWITTER-FAN-PAGE-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE0iUO9uPEQW7HE5DMWi5NdT_DvEXF1OTSBdOlTSNsw5g53HpWYVMYG1Prak_ueEmB9ndB9_AJCkoOroJWzwe0h8bLqiQULLS4XdqSeAGMKRVWNR4jXd8IgIttotrICw-xu077ncQlAcI/s1600/twitter.png" border="0"></a>
</td>
<td>
<a style="margin-left:5px;"href="ADD-FACEBOOK-FAN-PAGE-LINK-HERE" rel="nofollow" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjY61ydA4LRulGVoK3EJ4Cn7hekmDjtG9KODFejiBRafIZl4WYLGLYAU9lg3KpcNIMc6ZdVfoGX9NdXcuI_H37eO8PHNLbUVFuNdVMbAFnlSU_qI7vSqXdByuWtIhuIBDK86lel8vrfriY/s1600/facebook.png" border="0"></a>
</td>
</tr></tbody></table>
<div class="mbtbar">
<div class="emailsub">
<div class="emailupdatesform">
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=tntbystc', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="emailupdatesinput" name="email" value="Submit email..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Submit email...&#39;;}" onfocus="if (this.value == &#39;Submit email...&#39;) {this.value = &#39;&#39;;}" type="text" /><input value="tntbystc" name="uri" type="hidden" /><input value="Subscribe" class="joinemailupdates" type="submit" /></form></div></div></div></div>
</div>

Make these changes:
  • Replace ADD-FEEDBURNER-LINK-HERE with your Feedburner link which looks like this: http://feeds.feedburner.com/TntByStc
  • Replace the other two bolded texts with your Facebook and Twitter links.
  • Replace tntbystc with the Feedburner RSS Email Title which is always written at the end of your FEED Email Link as shown below,
http://feedburner.google.com/fb/a/mailverify?uri=tntbystc
    4.  Give your widget a Title and Save it.
    5.   You are all done!
Visit your blogs and make sure you have added it to the top most position on your sidebar. You will surely see a change in the number of your subscribers very soon provided that you post consistently.  Happy blogging! :)
 
Top