-->

Email Subscription Box for Blogger with Professional Look

In this post i am going to share with you a Professional Email Subscription Box for Blogger. Email Subscription Widget in Blogger not only helps your visitors to subscribe to all updates including latest updates of your blog but also increases the number of readers of your website as a result of using this Gadget pageviews will be increased. Many Big Authority Blogs and websites are using this kind of widget in their sites to keep their visitors up to date with latest and popular posts. You should also use this Gadget in your website to make your site more professional and user friendly.

You will see many sites on the internet which already have email subscription box in its template but a right one which matches with your website is very important, so today in this article i am going to share various kinds of professional Email Subscription Widgets for your blogger blog, which will surely fit with your site structure.

In next articles i will share Email Subscribe Widget with Social Media Sharing and Pop-up options, so do not forget to get those beautiful widgets. By the way this is a RSS Subscribe widget, if you do not know that what is feedburner, read its definition described below:

What is RSS Subscription
RSS (Really Simple Syndication) is used to keep regular visitors always stay updated with latest content of a site. It provides to all readers an easy navigation to read entire information on any site.

Email Subscription Box for Blogger

How to Add Professional Email Subscription Box in Blogger

  1. Login to Blogger Dashboard >> Layout >> Add a Gadget
  2. Select “HTML/JavaScript” option
  3. Copy one of your favorite below Gadget Code and Paste it into HTML/JavaScript
<style>#subscribe-box{width:299px;border:1px solid #aaaaaa;border-radius:2.98px;padding:2.98px 0} .subscribe-box-wrapper{background:url(http://4.bp.blogspot.com/-FnFdlcUoQ70/VM3J2JR7itI/AAAAAAAABcM/TosZcCPmujM/s1600/background.png) repeat scroll 0 0 #ffffff;color:#111111;font-size:13px;line-height:19px;padding:1px 20px 10px;text-align:center;text-transform:uppercase} .subscribe-box-form{clear:both;display:block;margin:10px 0}form.subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto} .subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#ffffff url(https://lh6.googleusercontent.com/-8NDOpOYN7b4/UcvO6A6i_YI/AAAAAAAACAk/tTYb0kLxcqg/s124/icons.png) no-repeat 0 -26px;border:1px solid #cccccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 39px;width:99%} .subscribe-box-email-button{background:#0099ff;border:1px solid #0080ff;box-shadow:0 1px 0 rgba(254,254,254,0.5) inset, 0 1px 0 transparent;color:#ffffff;cursor:pointer;font-family:verdana;font-weight:699;padding:10px;text-shadow:1px 1px 0 rgba(0,0,0,.5);text-transform:uppercase;width:100%} .subscribe-box-email-button:hover,.subscribe-box-email-button:focus{background:#179ffa} .subscribe-box-email-button:active{-moz-box-shadow:0 1px 4px rgba(0,0,0,0.6) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.6) inset;box-shadow:0 1px 4px rgba(0,0,0,0.6) inset;outline:0}iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);-webkit-box-shadow:0 3px 5px rgba(0,0,0,0.2);background:#FFFFFF;border:1px solid #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4.2px 4.2px 4.2px} #footer-section{border-top:1px solid #aaa;box-shadow:inset 0 4px 6px -3px #aaaaaa;font-family:cambria;font-size:13px;height:100px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%}a.social-icons{margin-right: 5.1px;height:46px;width:46px;}a.social-icons:hover { opacity: .7; filter:alpha(opacity=70);}</style>
<div id="subscribe-box"><div class="subscribe-box-wrapper">    <br><p>Subscribe To Our Email Newsletter to Receive Quality Updates Absolutely Free</p><a class="social-icons" href="http://feedburner.google.com/fb/a/mailverify?uri=bloggercell" target="_blank"><img src="http://3.bp.blogspot.com/-ugJyU9Pxcs4/VM3J6Cfj8gI/AAAAAAAABcU/zMAdXj1Jysk/s1600/Subscribe.png"></a><div class="subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=bloggercell" class="subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggercell', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="bloggercell"><input name="loc" type="hidden" value="en_US"><input class="subscribe-box-email-field" name="email" autocomplete="off" placeholder="Enter Your Email Address..."><input class="subscribe-box-email-button" title="" type="submit" value="Subscribe Now !"></form></div></div></div></div>

Now it is time to Modify this Gadget

  • Change all bloggercell with your feedburner ID
  • To change the width simply replace 299px with different number that fits with your template layout. For example enter 350px to increase the width whereas write 270 to decrease the width
Below Options are not recommended by us, but if you want to change it then do the following!
  • For changing Background image simply replace "http://4.bp.blogspot.com/-FnFdlcUoQ70/VM3J2JR7itI/AAAAAAAABcM/TosZcCPmujM/s1600/background.png" with your own background
  • Replace "http://3.bp.blogspot.com/-ugJyU9Pxcs4/VM3J6Cfj8gI/AAAAAAAABcU/zMAdXj1Jysk/s1600/Subscribe.png" with your own image to change the subscribe widget logo

Last Words

This is the WordPress like Professional Email Subscription Box for Blogger blogs. If you have any question relating to this JavaScript Widget in your mind then kindly let me know i will help you. Keep visiting my blog for getting more latest updates like Blogspot Widgets, SEO Tips, Make Money Online Tips, Internet and much more other blogging Tricks.
ViewCloseComments