18 May 2017

Responsive and stylish subscribe box for Blogger (Blogspot)

Email subscription widget for blogger, beautiful email subscription box for blogger, stylish email subscription widget for blogger, feedburner email subscription popup, subscribe now widget for blogger, blogger subscribe button, blogger newsletter widget, email subscription for blogger

Add responsive and stylish subscribe box for Blogger (Blogspot)

Hello Bloggers! Today I'm going to share to you a Blogger subscribe box widget/gadget with Name and Email filling box style. From which people can subscribe your blog to get your latest updates on their email account. This widget/gadget is quite responsive and is also great in appearance. You must use this widget/gadget.

Try this on your blog: Social Media Icons Buttons for Blogger (Blogspot)

Script code of subscribe box for Blogger (Blogspot)

<!-- Responsive and stylish subscribe box for Blogger (Blogspot) (http://www.howtolearnblog.com) created by Vishal Jaiswal (www.vishaljaiswal.in) -->
<style type='text/css'>
#subscribe-box{width:300px;height:auto;border-radius:2px;background-color:#3498db;box-shadow:5px 3px 0 0 #7f8c8d;padding-bottom:10px;margin-bottom:5px;}#subscribe-box .title{padding:10px 25px;line-height:16px;font:16px Century Gothic;color:#fff;text-align:center;background:#393939;text-transform:uppercase;border-radius:2px 2px 0 0;}#subscribe-box p{font-family:"Century Gothic",Century Gothic,Sans-Serif;font-size:14px;color:#FFF;line-height:20px;padding:10px 20px 0 20px;margin:0;}#subscribe-box .emailfield{padding:0 20px 10px;}#subscribe-box .emailfield input{color:#777;padding:10px;margin-top:10px;font-size:13px;font-family:"Century Gothic",Century Gothic,Sans-Serif;width:92%;border:0;border-radius:2px;box-shadow:0 3px 0 0 #bbb;}#subscribe-box .emailfield input:focus{outline:none;}#subscribe-box .emailfield .submitbutton{background:#F4836A;color:#fff!important;border:none;outline:none;width:100%;cursor:pointer;border-radius:2px;box-shadow:0 3px 0 0 #e23b16;}#subscribe-box .emailfield .submitbutton:active{padding-top:11px;padding-bottom:9px;box-shadow:0 1px 0 0 #3293ba;}#subscribe-box .emailfield .submitbutton:hover{background:#DD7761;}
</style>
<div id='subscribe-box'>
<div class='title'>
Subscribe Here
 </div>
<p>Sign up here with your email address to receive updates from this blog in your inbox.</p>
<div class='emailfield'>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=howtolearnblog&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
 <input type='text' name='name' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Your Name&quot;;}' onfocus='if (this.value == &quot;Your Name&quot;) {this.value = &quot;&quot;;}' value='Your Name'/>
<input type='text' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Your Email&quot;;}' onfocus='if (this.value == &quot;Your Email&quot;) {this.value = &quot;&quot;;}' value='Your Email'/>
<input name='uri' type='hidden' value='howtolearnblog'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='submitbutton' type='submit' value='Subscribe Now!'/>
 </form>
 </div>
</div>
</div>

Try this: Responsive Recent Post Widget on Blogger/Blogspot

How to setup subscribe box for Blogger (Blogspot)?

Follow these steps:
1. Replace all the yellow marked name with your blog feed name .
2. The paste this code on sidebar of your blog.
If any problem occur. Please comment below in comment box. That problem will be fixed.
Responsive and stylish subscribe box for Blogger (Blogspot)
4/ 5
Oleh

Subscribe via email

Share the post above? Please subscribe to the latest information updates directly via email.

4 comments

Tulis comments
avatar
Thursday, May 25, 2017

That was some great stuff.... It can make the blog look quite a professional.. you are doing a great job...

Reply
avatar
Friday, July 14, 2017

Can you share your e-mail subscription box?

Reply
avatar
Friday, July 14, 2017

Which type of design are you looking for?
Please comment below!

Reply

Please note before commenting on this page.
1. Don't comment as for advertisement purpose.
2. Don't hyperlink your website inside comment box.
3. Abuses are strictly prohibited.
4. If necessary, you can post the only URL without any text hyperlink.