Email Subscription Box For Blogger.Com - Below Every Post!

I've come with a great email subscription box that can boost your email subscribers and will build your audience. This widget is neat clean, attractive that can make more subscribers, simple and it is build with HTML and CSS3. This widget shows the title, litter description, enter email address box and a dashing subscribe button with hover effect. This subscription box is working fine in all browsers I've checked it fully.

Demo

Demo of this widget is in our below every post you can check it by scrolling down at the end of this post.

Credits

This widget is totally developed by me and I'm giving this premium widget to you for free. So please respect our efforts and don't remove the credit link in it. If you want to share this widget on your blog then you must have to link back us or mention us in your post. Thanks.

How To Add an Efficient Email Subscription Box In Blogger?

As I told you that the better place for adding this widget in your blog is below every post, So in the below tutorial, we're going to add this widget below every post. Let's start it.

• Go To Blogger >> Template >> Backup Your Template
• Click Edit HTML, Click Anywhere in the coding box to Active it.
• Now Press CTRL+F and Find The Below Code.
• <data:post.body/>
•  Paste The Following Code Below Above Searched Code.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <center>
  <style>
.subbox{width:500px;height:222px;background:#29C5F6;border:5px solid #000;padding:10px}
.subbox h1{font-size:25px;font-weight:700;color:#FEFEFE;text-align:center}
.subbox p{font-size:15px;text-align:center;line-height:25px;color:#fff}
.subbox input{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNsQknNMWOMcu-xWTvf1-tjIl_l8k07VMG4-44fb8-hVslqbdn6z5kto1q4EcW_kFiCPLQFdE4ClDE8mAcI85HSmzYTkjqTlh3elsNpvnaN4P2Sf97XdwR7GF_TFPnww4mWBEpcymK2JJh/s1600/subscribe-email.png) no-repeat right;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;box-shadow:4px 4px 4px #333;-moz-box-shadow:4px 4px 4px #333;-webkit-box-shadow:4px 4px 4px #333;margin:0;border:1px solid #111!important;font-size:15px!important;margin-bottom:10px!important;padding:8px 28px 8px 10px !important}
.subbox .submit{background:#FFF}
.subbox .submit:hover{background-color:#000;color:#fff;text-decoration:none}
</style>
<div class='subbox'>
<h1>Be A Part Of Us!</h1><i class='fa fa-envelope-o' style='background:#000; color:#fff; width: 50px; height: 50px; display:block; line-height: 50px; text-align:center; font-size: 24px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; margin: 0 auto;'/>
<p>Love to read our articles? SignUp now to get fresh content directly into your inbox. | Don't worry we hate spam as much as you!</p>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=bloggerjinni&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);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='bloggerjinni'/>
<input name='loc' type='hidden' value='en_US'/>
  <input class='submit' type='submit' value='Submit'/>  </center>
  </form>
<!--Please Don't Remove The Credit Link -->
<div style='float:right; font-size:10px; font-family:sans-serif; text-decoration:none;'><a href='https://bloggerjinni.blogspot.com/2015/10/email-subscription.html'>Get This Now!</a></div>
  </div>
  </center>
      </b:if>

• Replace BloggerJinni With Your Feedburner Username Two Times.
• Save Your Template & You Have Done !
• That's All! 

Last Words

So friends, This was our an email subscription box that can build your email subscribers. Friends, Please don't remove the credit link in it. It took about 4 hours to develop and I hope you are understanding. Stay connected with me and my blog for more resources and Take a lot of care of you and your family. Happy Blogging!

• Tweet
• Share
• Share
• Share
• Share

About Admin

Syed Zaver Abbas is SEO expert in pakistan. he is web designer, web developer, software developer and graphics designer that means he is multi talented. he is also learning more about computer science.

Related Post