Beautiful Email Subscription Blogger Widget.

Advertisements

This is a clean, basic and engaging widget which is clearly set to help you in building the message subscribers record. This widget is assemble with just two modifying dialects which are Css3 and HTML. In the wake of improving this, we've weighed it in some most mainstream programs and we came to realize that its working really cool in every program. It comprises of a title on the top, little depiction plus cool symbol to tell the subscriber that what he will get, two information fields which are Name and Email Address, a little line for telling your guests that we'll not spam and in the last, a wonderful Sign Up catch. This widget is having 500 pixels width, So the best place for including this widget is beneath every post. There you have more risks of getting new subscribers. When you get this widget in your site, have a live look on this widget by pressing the beneath catch.

Click Here For Demo

Don't Miss this widgets

Steps to follow

Go to Blogger >> Layout.
Now click on "Add gadget".
Scroll down to "HTML/Javascript" and click on it.
Copy below code and paste it on it.

<style>
#bt-newsletter{ width:290px;background:#2e3639; color:#fff; padding:20px; font-size:14px; margin-bottom:20px; -moz-box-shadow: 2px 2px 2px #000000;-webkit-box-shadow: 5px 5px 5px #000000;box-shadow: 5px 5px 5px #000000;border:double 5px #000000;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright:5px;
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-top-left-radius:5px;
-webkit-border-top-right-radius:5px;
-webkit-border-bottom-left-radius:5px;
-webkit-border-bottom-right-radius:5px;
border-top-left-radius:5px;border-top-right-radius:5px;border-bottom-left-radius:5px;border-bottom-right-radius:5px;}

#bt-newsletter .bt-title { margin-bottom:10px;margin-top:-10px; }
.bt-title{margin-left: 2px;font-size:25px; font-weight:bold; border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;padding:1px 8px 2px 8px;text-align:center;display:inline-block;}

#footer-subscribe-btn {width:115px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;
position:relative;left:90px;}
.footer-submit-btn {margin-left:-30px;margin-top:5px;margin-bottom:-50px;border: none;color: #fff;text-transform: uppercase; font-size: 13px;padding: 5px 18px 5px;background: #e93a30;border-radius: 30px;-webkit-border-radius: 30px;
-moz-border-radius: 30px;font-weight: bold;-webkit-transition: background .2s linear;
-moz-transition: background .2s linear;-ms-transition: background .2s linear;-o-transition: background .2s linear;transition: background .2s linear;cursor: pointer;
}
.footer-submit-btn:hover { background:#e51111;}

#fastsearch ,#footer-subscribe-email{background:#62686b;color:#fff;font-size:14px;border:none;
box-sizing:border-box;border-radius:30px;-webkit-border-radius:30px;-moz-border-radius:30px;outline:none;padding:0px 15px; height:30px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
#fastsearch.inactive ,
#footer-subscribe-email.inactive {color:#b5b7b8;}
#footer-subscribe-email {width:100%;}
</style>

<div id="bt-newsletter">
<div class="bt-title">
Get Email Updates</div>
<div class="bt-nl-text">
<center>
Subscribe to Get Latest Updates Free</center>
</div>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=simbh', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="inactive footer-text-field" id="footer-subscribe-email" name="EMAIL" onblur="ifundefinedthis.value=='')this.value=this.defaultValue;" onfocus="ifundefinedthis.value==this.defaultValue)this.value='';" type="text" value="Your email address" />
<input name="uri" type="hidden" value="simbh" />
<input name="loc" type="hidden" value="en_US" />

<input class="footer-submit-btn" id="footer-subscribe-btn" type="submit" value="Subscribe" />

<div class="clr">
</div>
</form>
</div><span style="font-family: Times New Roman;"><span style="white-space: normal;">
</span></span>

Change "simbh" with your feedburner id and save it.

That's it. Let us know if you have any problem to implementing this widget.

Conclusion:

We will include Email Subscription Widget with Comments Counter beneath Post Title in Blogger. We have specified a few steps underneath accompany them precisely.

So Guys! I Hope you will like this widget, If you have any inquiry don't hesitate to ask me.

Like the Post? Share with your Friends:-