Add Beautiful Email Subscription Forms For Blogger

If you want to increase subscribers to your blog then beautiful email subscription forms will help you a lot.If you have more subscribers then you have a lot of traffic to your blog. Today I want to tell about some beautiful email subscription forms which are designed by Design 3 Edge and converted into a blogger widget from a .psd file by us.

You just have copy and paste the code.Let's start the tutorial "How to Add Beautiful Email Subscription Forms Into Blogger Blogs".

Beautiful Email Subscription Forms For Blogger Blogs

How To Add Email Subscription Forms To Blogger Blog

• Choose a Widget Style -> Copy The Code Of Widget
• Paste Code Into Your Notepad
• Replace Our Feedburner Username With Your Own Username
• Now Go to Blogger Dashboard > Layout
• Then Select Add a Gadget > HTML/JavaScript
• Copy and Paste The Code From Notepad Into That Gadget and Click On Save

Beautiful Email Subscription Form Style - 1

<style type="text/css">
#blogsdaddy-emailbox {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmq1rR-naufcIUrGFNgjUqG0fCJ7MM2fRXLTiLM7hdyP-2u1zT1aoQv-hDJyvWOCgjt92TZuYM8HwuP2EkJGGnueFJDisvPAAPfNtHR4tvHXttREOjN_YaIvPx94sREShaAUaeumY-fEE/s1600/blogsdaddy.com-red.png)no-repeat scroll center center transparent;
height: 143px;
width: 368px;
}
form#blogsdaddy-emailform {
display: block;
margin: 0;
padding-left: 42px;
padding-top: 67px;
}
form#blogsdaddy-emailform #s {
background: transparent;
border: none;
color: #444242;
font-family: georgia;
font-size: 15px;
font-style: italic;
height: 30px;
margin-top: -2px;
padding-left: 2px;
vertical-align: top;
width: 227px;
}
form#blogsdaddy-emailform #sbutton {
background: transparent;
border: none;
cursor: pointer;
height: 30px;
padding-right: 45px;
}</style>
<div id="blogsdaddy-emailbox">
<form id="blogsdaddy-emailform" action="http://feedburner.google.com/fb/a/mailverify"
method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=BlogsDaddy', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="BlogsDaddy" name="uri" />
<input type="text" id="s" name="email" value="Enter Your E-Mail Here"
onfocus='if (this.value == "Enter Your E-Mail Here") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Enter Your E-Mail Here";}'
/>
<input type="hidden" name="loc" value="en_US" />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>

Beautiful Email Subscription Form Style - 2

<style type="text/css">
#blogsdaddy-emailbox {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS60OwUY-KmcZih5wb2SmWT69wGJzF2DcLGitLEswVzJZjp1MHBIkLZMJXzzANUXxkLX2ArodOP2gxCr7p6kyWoh9hp_AqDuc6J_BsnmfZ1CmTWLXFuoTzpQbhNInsq2afk-OaIDs8fns/s1600/helperblogger.com-blue.png)no-repeat scroll center center transparent;
height: 143px;
width: 368px;
}
form#blogsdaddy-emailform {
display: block;
margin: 0;
padding-left: 42px;
padding-top: 67px;
}
form#blogsdaddy-emailform #s {
background: transparent;
border: none;
color: #444242;
font-family: georgia;
font-size: 15px;
font-style: italic;
height: 30px;
margin-top: -2px;
padding-left: 2px;
vertical-align: top;
width: 227px;
}
form#blogsdaddy-emailform #sbutton {
background: transparent;
border: none;
cursor: pointer;
height: 30px;
padding-right: 45px;
}</style>
<div id="blogsdaddy-emailbox">
<form id="blogsdaddy-emailform" action="http://feedburner.google.com/fb/a/mailverify"
method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=BlogsDaddy', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="BlogsDaddy" name="uri" />
<input type="text" id="s" name="email" value="Enter Your E-Mail Here"
onfocus='if (this.value == "Enter Your E-Mail Here") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Enter Your E-Mail Here";}'
/>
<input type="hidden" name="loc" value="en_US" />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>

Beautiful Email Subscription Form Style - 3

<style type="text/css">
#blogsdaddy-emailbox {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMAssVCbikJ-PRjRbEd75e6g7TVaUyNT3YSQ8aGXBD2jEl3C4RBdZoX2iJrwZvkfvtq6rMgOQwRYlldslYxxsTrCf7YhHWSxABqV6nDXRHz-XGXbXiUCNtrnJh-GQfzd9pZegmXhBUnN8/s1600/helperblogger.com-silver.png)no-repeat scroll center center transparent;
height: 143px;
width: 368px;
}
form#blogsdaddy-emailform {
display: block;
margin: 0;
padding-left: 42px;
padding-top: 67px;
}
form#blogsdaddy-emailform #s {
background: transparent;
border: none;
color: #444242;
font-family: georgia;
font-size: 15px;
font-style: italic;
height: 30px;
margin-top: -2px;
padding-left: 2px;
vertical-align: top;
width: 227px;
}
form#blogsdaddy-emailform #sbutton {
background: transparent;
border: none;
cursor: pointer;
height: 30px;
padding-right: 45px;
}</style>
<div id="blogsdaddy-emailbox">
<form id="blogsdaddy-emailform" action="http://feedburner.google.com/fb/a/mailverify"
method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=BlogsDaddy', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="BlogsDaddy" name="uri" />
<input type="text" id="s" name="email" value="Enter Your E-Mail Here"
onfocus='if (this.value == "Enter Your E-Mail Here") {this.value = ""}'
onblur='if (this.value == "") {this.value = "Enter Your E-Mail Here";}'
/>
<input type="hidden" name="loc" value="en_US" />
<input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
/>
</form>
</div>

Remember - Replace BlogsDaddy With Your Own Feedburner Username

If you are facing any problem regarding this widget then please ask via comments below.I hope you enjoyed the tutorial. Feel free to share suggestions with us. Keep blogging. :)