Add Awesome Subscription Box below Post on Blogger

Today I would like to share a professional looks subscription box widget that appears on every post on your blog. This is a rectangular widget with a simple but professional looks design that can catch your reader's attention if they already done reading your post. This kind of widget is implemented also on this blog. Below is a screenshot of what the subscription box looks like.

Installation Guide

1.) Just like before we need to put some CSS code first so just go to Blogger Dashboard ->> Template ->> Edit HTML, find this code ]]></b:skin> and just above it put the codes given below.

#Box {background: #F5F5F5;text-align: center;width: 100%;display: block;margin: 10px 0 0px 0;height: 80px;border: 1px solid #000066;}
.Internet-Email {color: #444242;width: 35%;background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTeFWtR8H52yindMN40vPbTHGeIY-APdmrBqLq5_d6MqxnqKQnr4TRmDXF2a3DbxBKoUskdZM_IVotEwhPaevMx3miEzQsRdZjhWt4eTks2OUVpigFh1wzJGNzHzsDfSBDPM7WW850hj8/s1600/email.png) no-repeat 8px 7px;padding: 6px 0px 5px 30px;border-radius: 3px;border: 1px solid #000;margin: 5px 2px;}
.mail-button:hover {background: #464DEC;border: 1px solid #000;}
.mail-button {background: #460F97;cursor: pointer;color: #FFF;font-weight: bold;border: 1px solid #000;border-radius: 2px; font-size: 15px;padding: 4px 15px 4px 19px;margin-left: 15px;}
#Headline {text-align: center;color: #0D862F;font-size: 17px;line-height:20px;padding: 9px 0 0 0; margin-bottom: 4px;font-weight: bold;font-family: sans-serif;}

2.) Find this code <div class='post-footer-line post-footer-line-1'/> on your template, just above this code paste the codes that given below.

<b:if cond='data:blog.pageType == &quot;item&quot;'><div id='Box'><div id='Headline'>Subscribe by Email and Get Free Updates on my Blog</div><form action='http://feedburner.google.com/fb/a/mailverify' class='btntEmailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=Internetsmashr&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'><input name='uri' type='hidden' value='Internetsmash'/> <input name='loc' type='hidden' value='en_US'/> <input class='Internet-Email' 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;}' required='' type='text' value='Enter your Email Address'/> <input class='mail-button' title='' type='submit' value='Sign Up'/></form><div class='clr'/></div></b:if>

Customization

Red Color: You may change the text whatever you want should appear on the header part of the subscription box.
Blue Color: Just change it with your own RSS feed Address.