4 Efficient Subscribe Box Below Every Post For Blogger

This is another great subscription box for blogger.This is a simple but efficient subscribe box.This box should be placed below post body so that when reader will complete post reading he/she can subscribe to your blog's updates.

Demo:

Click Here.

Steps to Add Efficient Subscribe Box:

• Log in to your Blogger Account.
• Go to Templates >> Edit HTML.
• Tick Expand Widget Templates.
• Find for <div class='post-footer-line post-footer-line-1'> tag.
• Paste any of  the below code after <div class='post-footer-line post-footer-line-1'> tag.

Orange Subscribe Box:

Code: 

<b:if cond='data:blog.url != data:blog.homepageUrl'><div id="subscribe-box-sbm">
<div class="white-border">
<div class="subscribe-box-sbm-wrap">
<h4>Don't Miss Another Post</h4>
<p>Join over 2,000 people who get free and fresh content delivered automatically each time we publish.</p>
<form id="subscribe" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=SmartBloggingMethods', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow" method="post" action="http://feedburner.google.com/fb/a/mailverify">
                          <input id="subbox" type="email" 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...">
                           <input type="hidden" value="SmartBloggingMethods" name="uri">
                           <input type="hidden" value="en_US" name="loc">
                           <input id="subbutton" type="submit" value="Sign Up">
                        </form>
</div>
</div>
</div>
<style>
#subscribe-box-sbm {
    background-color: #f5f5f5;
    border: 10px solid #e4e4e4;
    margin-top: 30px;
}
#subscribe-box-sbm .white-border {
    border: 1px solid #fff;
}
.subscribe-box-sbm-wrap {
    background: url("https://lh5.googleusercontent.com/-bup-BJY9bmI/URuTy8bOPsI/AAAAAAAABVE/moqWzQTC2Q0/s127/signup-ribbon-sbm.png") no-repeat scroll left top transparent;
    margin: -17px -18px;
    overflow: hidden;
    padding: 45px 30px 40px;
    text-align: center;
    text-shadow: 1px 1px #fff;
}
.subscribe-box-sbm-wrap h4 {
    text-align: center;
font-size: 26px;
}
.subscribe-box-sbm-wrap p {
    margin: 0 35px 20px;
    text-align: center;
}
.subscribe-box-sbm-wrap input[type="email"] {
    background: url("https://lh6.googleusercontent.com/-ZIg5thLqiDY/URuTyxSPNFI/AAAAAAAABVA/lei3Y-3lELE/s50/email%2520icon%2520sbm.png") no-repeat scroll left center #fff;
    box-shadow: 0 0 5px #ccc inset;
    color: #999;
    font-family: 'proxima-nova',sans-serif;
    font-size: 12px;
    margin: 0 5px;
    padding: 15px 0 15px 45px;
    width: 40%;
}
.subscribe-box-sbm-wrap input[type="submit"] {
    box-shadow: 0 1px 1px #a24a1d;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 15px;
    text-transform: uppercase;
}
input[type="submit"] {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
height:45px;
color: white;
cursor: pointer;
background-color: orange;
border-radius: 20px;
border: 5px none #ECEAE5;
padding: 11px 20px 9px 20px;
margin: 10px 10px 10px 0px;
}
</style></b:if>

Blue Subscribe Box:

Code:

<b:if cond='data:blog.url != data:blog.homepageUrl'><div id="subscribe-box-sbm">
<div class="white-border">
<div class="subscribe-box-sbm-wrap">
<h4>Don't Miss Another Post</h4>
<p>Join over 2,000 people who get free and fresh content delivered automatically each time we publish.</p>
<form id="subscribe" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=SmartBloggingMethods', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow" method="post" action="http://feedburner.google.com/fb/a/mailverify">
                          <input id="subbox" type="email" 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...">
                           <input type="hidden" value="SmartBloggingMethods" name="uri">
                           <input type="hidden" value="en_US" name="loc">
                           <input id="subbutton" type="submit" value="Sign Up">
                        </form>
</div>
</div>
</div>
<style>
#subscribe-box-sbm {
    background-color: #f5f5f5;
    border: 10px solid #e4e4e4;
    margin-top: 30px;
}
#subscribe-box-sbm .white-border {
    border: 1px solid #fff;
}
.subscribe-box-sbm-wrap {
    background: url("https://lh5.googleusercontent.com/-Jk33mfePNXA/URuWhbGkxkI/AAAAAAAABVc/vwzUJ2veG-0/h120/signup-ribbonblue-sbm.png") no-repeat scroll left top transparent;
    margin: -17px -18px;
    overflow: hidden;
    padding: 45px 30px 40px;
    text-align: center;
    text-shadow: 1px 1px #fff;
}
.subscribe-box-sbm-wrap h4 {
    text-align: center;
font-size: 26px;
}
.subscribe-box-sbm-wrap p {
    margin: 0 35px 20px;
    text-align: center;
}
.subscribe-box-sbm-wrap input[type="email"] {
    background: url("https://lh6.googleusercontent.com/-ZIg5thLqiDY/URuTyxSPNFI/AAAAAAAABVA/lei3Y-3lELE/s50/email%2520icon%2520sbm.png") no-repeat scroll left center #fff;
    box-shadow: 0 0 5px #ccc inset;
    color: #999;
    font-family: 'proxima-nova',sans-serif;
    font-size: 12px;
    margin: 0 5px;
    padding: 15px 0 15px 45px;
    width: 40%;
}
.subscribe-box-sbm-wrap input[type="submit"] {
    box-shadow: 0 1px 1px blue;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 15px;
    text-transform: uppercase;
}
input[type="submit"] {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
height:45px;
color: white;
cursor: pointer;
background-color:#0090ff;
border-radius: 20px;
border: 5px none #ECEAE5;
padding: 11px 20px 9px 20px;
margin: 10px 10px 10px 0px;
}
</style></b:if>

Red Subscribe Box:

Code:

<b:if cond='data:blog.url != data:blog.homepageUrl'><div id="subscribe-box-sbm">
<div class="white-border">
<div class="subscribe-box-sbm-wrap">
<h4>Don't Miss Another Post</h4>
<p>Join over 2,000 people who get free and fresh content delivered automatically each time we publish.</p>
<form id="subscribe" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=SmartBloggingMethods', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow" method="post" action="http://feedburner.google.com/fb/a/mailverify">
                          <input id="subbox" type="email" 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...">
                           <input type="hidden" value="SmartBloggingMethods" name="uri">
                           <input type="hidden" value="en_US" name="loc">
                           <input id="subbutton" type="submit" value="Sign Up">
                        </form>
</div>
</div>
</div>
<style>
#subscribe-box-sbm {
    background-color: #f5f5f5;
    border: 10px solid #e4e4e4;
    margin-top: 30px;
}
#subscribe-box-sbm .white-border {
    border: 1px solid #fff;
}
.subscribe-box-sbm-wrap {
    background: url("https://lh5.googleusercontent.com/-v3nOgxGS_2I/URuXVdJoSwI/AAAAAAAABVs/_wLaMsB7aTE/h120/signup-ribbon-red-sbm.png") no-repeat scroll left top transparent;
    margin: -17px -18px;
    overflow: hidden;
    padding: 45px 30px 40px;
    text-align: center;
    text-shadow: 1px 1px #fff;
}
.subscribe-box-sbm-wrap h4 {
    text-align: center;
font-size: 26px;
}
.subscribe-box-sbm-wrap p {
    margin: 0 35px 20px;
    text-align: center;
}
.subscribe-box-sbm-wrap input[type="email"] {
    background: url("https://lh6.googleusercontent.com/-ZIg5thLqiDY/URuTyxSPNFI/AAAAAAAABVA/lei3Y-3lELE/s50/email%2520icon%2520sbm.png") no-repeat scroll left center #fff;
    box-shadow: 0 0 5px #ccc inset;
    color: #999;
    font-family: 'proxima-nova',sans-serif;
    font-size: 12px;
    margin: 0 5px;
    padding: 15px 0 15px 45px;
    width: 40%;
}
.subscribe-box-sbm-wrap input[type="submit"] {
    box-shadow: 0 1px 1px darkred;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 15px;
    text-transform: uppercase;
}
input[type="submit"] {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
height:45px;
color: white;
cursor: pointer;
background-color:red;
border-radius: 20px;
border: 5px none #ECEAE5;
padding: 11px 20px 9px 20px;
margin: 10px 10px 10px 0px;
}
</style></b:if>

Green Subscribe Box:

Code:

<b:if cond='data:blog.url != data:blog.homepageUrl'><div id="subscribe-box-sbm">
<div class="white-border">
<div class="subscribe-box-sbm-wrap">
<h4>Don't Miss Another Post</h4>
<p>Join over 2,000 people who get free and fresh content delivered automatically each time we publish.</p>
<form id="subscribe" onsubmit="window.open( 'http://feedburner.google.com/fb/a/mailverify?uri=SmartBloggingMethods', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow" method="post" action="http://feedburner.google.com/fb/a/mailverify">
                          <input id="subbox" type="email" 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...">
                           <input type="hidden" value="SmartBloggingMethods" name="uri">
                           <input type="hidden" value="en_US" name="loc">
                           <input id="subbutton" type="submit" value="Sign Up">
                        </form>
</div>
</div>
</div>
<style>
#subscribe-box-sbm {
    background-color: #f5f5f5;
    border: 10px solid #e4e4e4;
    margin-top: 30px;
}
#subscribe-box-sbm .white-border {
    border: 1px solid #fff;
}
.subscribe-box-sbm-wrap {
    background: url("https://lh5.googleusercontent.com/-iXBST_PuvOw/URuX6n0_ZbI/AAAAAAAABV0/T323dw-zwqk/h120/signup-ribbon-green-sbm.png") no-repeat scroll left top transparent;
    margin: -17px -18px;
    overflow: hidden;
    padding: 45px 30px 40px;
    text-align: center;
    text-shadow: 1px 1px #fff;
}
.subscribe-box-sbm-wrap h4 {
    text-align: center;
font-size: 26px;
}
.subscribe-box-sbm-wrap p {
    margin: 0 35px 20px;
    text-align: center;
}
.subscribe-box-sbm-wrap input[type="email"] {
    background: url("https://lh6.googleusercontent.com/-ZIg5thLqiDY/URuTyxSPNFI/AAAAAAAABVA/lei3Y-3lELE/s50/email%2520icon%2520sbm.png") no-repeat scroll left center #fff;
    box-shadow: 0 0 5px #ccc inset;
    color: #999;
    font-family: 'proxima-nova',sans-serif;
    font-size: 12px;
    margin: 0 5px;
    padding: 15px 0 15px 45px;
    width: 40%;
}
.subscribe-box-sbm-wrap input[type="submit"] {
    box-shadow: 0 1px 1px green;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 15px;
    text-transform: uppercase;
}
input[type="submit"] {
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
height:45px;
color: white;
cursor: pointer;
background-color:#00ff24;
border-radius: 20px;
border: 5px none #ECEAE5;
padding: 11px 20px 9px 20px;
margin: 10px 10px 10px 0px;
}
</style></b:if>

• Now, click on Save the Template.

Customization:

Replace the SmartBloggingMethods ( In Blue ) with your feedburner username.

You now have a simple but efficient subscribe box working below your post to increase your subscribers.