How To Add Subscribe To Our Newsletter Box Below Post Footer

Hello Guys,Today in this article we are going to explain How to Add a Subscribe To our Newsletter Widget  Box in blogger template.Now days lot's of website using this feature and it's very important for every website or blog.You must be thinking how its important? I will tell you how its so useful and it will also increase the loyalty of your website and the traffic too.You may have noticed in big websites (means getting traffic over 100k page views everyday) all are using subscribe box to increase the traffic and also the loyal users.There is nothing so tricky when a user visit your website and s/he likes your website so that he must be look to stay update with your blog or website to get everyday new updates that time they all subscribe to your website latest/recent updates.And the plus point is this you have gained the loyal user for your visitors,because if users don't like your website they won't subscribe you.

However we all think positive and try our best to put best infront of visitors and never give up,keep updating your website your rank will definitely increase and the traffic too.subscribe to our daily posts and stay update whenever we update our blog or website gadget for blogspot template.We have used CSS to  make this tool beautiful.So to grab this subscribe to our website gadget follow the steps mentioned below.

How to Add Subscribe to Our Newsletter Widget Box In Blogger Template

installation steps:

Step 1. Log in to your Blogger account and Go to your Blogger Dashboard.
Step 2. Now Click on -> Template -> Edit HTML.
Step 3. Now Search for the </b:skin> or </style> and copy the below CSS code and paste it just above </b:skin> or </style>

/* Subscribe to our Newsletter box by www.Bloggersstand.com */
#subscribe-css{position:relative;padding:20px 0;background:#222;overflow:hidden;border-top:4px solid #eee;}
.subscribe-wrapper{color:#fff;font-size:16px;line-height:normal;margin:0;text-align:center;text-transform:none;font-weight:400;width:100%}
.subscribe-form{clear:both;display:block;overflow:hidden}
form.subscribe-form{clear:both;display:block;margin:0;width:auto;overflow:hidden}
.subscribe-css-email-field{background:#333;color:#ccc;margin:10px 0;padding:15px 20px;width:35%;border:0}
.subscribe-css-email-button{background:#ff675c;color:#fff;cursor:pointer;font-weight:700;padding:14px 30px;margin-left:15px;text-transform:none;font-size:16px;border:0;border-radius:3px;transition:all .6s}
.subscribe-css-email-button:hover{background:#ea5a50;}
#subscribe-css p.subscribe-note{margin:16px;text-align:center;color:rgba(255,255,255,.6);font-size:180%;font-weight:400;line-height:normal;}
#subscribe-css p.subscribe-note span {position:relative;overflow:hidden;font-weight:700;transition:all .5s}
#subscribe-css p.subscribe-note span.itatu {font-weight:400;font-style:italic;color:rgba(255,255,255,.6);text-transform:lowercase}
#subscribe-css p.subscribe-note span.itatu:before,#subscribe-css p.subscribe-note span.itatu:after{display:none}
#subscribe-css p.subscribe-note span:before{content:'';position:absolute;bottom:-2px;left:0;width:0;height:3px;margin:10px 0 0;background:rgba(255,255,255,.1);transition:all .5s}
#subscribe-css:hover p.subscribe-note span:before{width:100%;}

Step 4. Now Search for <div class='post-footer-line-1'> or <data:post.body/> and paste the below html code just above it.

<div id='subscribe-css'>
<p class='subscribe-note'><span>SUBSCRIBE</span>
<span class='itatu'>TO</span> OUR NEWSLETTER</p>
<div class='subscribe-wrapper'>
<div class='subscribe-form'>
<form action='http://feedburner.google.com/fb/a/mailverify?uri=bloggersstand' class='subscribe-form' method='post' onsubmit='window.open (&#39;http://feedburner.google.com/fb/a/mailverify?uri=bloggersstand&#39;, &#39;popupwindow&#39;, &#39;scrollbars=yes,width=550,height=520&#39;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='bloggersstand'/><input name='loc' type='hidden' value='en_US'/><input autocomplete='off' class='subscribe-css-email-field' name='email' placeholder='Enter your Email'/><input class='subscribe-css-email-button' title='Join us' type='submit' value='submit'/></form>
</div>
</div>
</div>

Customization: 

• Just replace bloggersstand with your feedburner username .

Step 5. Now Save your Template..Done !