Simple Subscription Box Below Post For Your Blogger Blog

Subscribers are counted as loyal readers of any blog hence you should have a strong subscriber list to make your blog popular. Here I am with a simple yet cool subscription box which will help you to get more subscribers for your blog. You can place this subscription box below the post. To add this subscription box below your post just follow the steps given below.

Add A Simple Subscription Box :

1. Go to Blogger Dashboard > Design > Edit HTML
2. Back Up Your Template
3. Now Check The "Expand Widget Template" Box
4. Now Search For This

]]></b:skin>

 5. Just Above This Add The Following Code

#SBT-subscribe{background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ffffdf));border:1px solid #dedede;border-radius:10px; margin-bottom:10px;padding:10px;text-align:center;background: -moz-linear-gradient(top, #333, #1a2638)}

#SBT-subscribe h1{margin-top:5px; color:#269;font-family:georgia;font-size:25px;margin-bottom:5px;padding:0;text-shadow:0 1px 2px #000;line-height:35px}

#SBT-subscribe input{background: -moz-linear-gradient(center top , #000, #EFEFEF) repeat scroll 0 0 transparent;border: 1px solid #dedede;border-radius:10px 10px 10px 10px;font-size:14px;padding:10px;text-shadow:1px 1px 0 #fff;width:280px; color:#666; font-family:georgia; margin-bottom:5px;}

#SBT-subscribe .submit{background: -webkit-gradient(linear, left top, left bottom, from(#ffda4d), to(#ff9b00));background: -moz-linear-gradient(center top , #369A18, #205F0D) repeat scroll 0 0 transparent;color:#fff;cursor:pointer;font-weight:bold;margin-left:20px;text-shadow:0 1px 2px #000;width:120px; font-family:georgia; margin-left:5px;}

#SBT-subscribe .submit:hover{background: -moz-linear-gradient(center top , #ff9b00, #ffda4d) repeat scroll 0 0 transparent}

#SBT-subscribe .submit:active{background: -moz-linear-gradient(center top , #ff9b00, #ffda4d) repeat scroll 0 0 transparent}

6. Now Search For

<data:post.body/> 

7. Paste the following code just below it

<b:if cond="data:blog.pageType == &quot;item&quot;">
<div id="SBT-subscribe">
<h1>
Subscribe To Get FREE Tutorials!</h1>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Smartbloggertricks', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<center>
<input name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter Your Email Address...&quot;;}" onfocus="if (this.value == &quot;Enter Your Email Address...&quot;) {this.value = &quot;&quot;}" size="30" type="text" value="Enter Your Email Address..." /> <input name="uri" type="hidden" value="Smartbloggertricks" /> <input name="loc" type="hidden" value="en_US" /> <input class="submit" type="submit" value="Subscribe" /></center>
</form>
</div>
</b:if>

Now You Are Done, Just Make Few Changes

Replace http://feedburner.google.com/fb/a/mailverify?uri=Smartbloggertricks with your Feedburner Feed address.

Now Replace Smartbloggertricks with your feed title.

Need Help?

Hope you like the subscription box, If you need any kind of help feel free to ask your query via leaving a comment by using the comment form given below till then Happy Blogging.