Stylish Feedburner Email Designs For Blog

Stylish Feedburner email design gives extra gorgeous look to your blog. It attracts your blog readers to get instant updates from your blog. It also increase your blog's look and style as well traffic. Today i will tell you how to add stylish Feedburner Email Design to your Blog. Because the Default Feedburner look so dull and simple.

1.

Copy and Paste the following code into HTML/Javascript for 'Design 1'

<style type="text/css">
#widgetcraft-emailbox {   background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjp6c_ox6sfVaYNIoIiIZqQqYUjxrQKDDut_E91jN1lI1rnCoTWTx-uf75_fCAzQs9P3ZoitC6WHY_Nc3YJdoTnhqOy2NLq90jr-G86GGSRdfrVT1S4_819BsuVI2CQ2uF0UYykB90XBDQ/s1600/design+1.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#widgetcraft-emailform {
    display: block;
    margin: 0;
    padding-left: 23px;
    padding-top: 83px;
}
form#widgetcraft-emailform #s {
    background: transparent;
    border: none;
    color: #444242;
    font-family: georgia;
    font-size: 15px;
    font-style: italic;
    height: 30px;
    margin-top: 0px;
    padding-left: -2px;
    vertical-align: top;
    width: 180px;
    outline:0px;
}
form#widgetcraft-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    margin-left:44px;
    padding-right: 4px;
    }
</style>
<div id="widgetcraft-emailbox">
    <form id="widgetcraft-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FeedURL', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="FeedURL" 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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRJcX-AsKS7uu13V7br6MlEos_pvJUL81Rj0iXNnLtJB8NhMxH38AzGSk3e9yaX15alihTD5K7GVyUdi03g8KCsYYaurrXrpGr-X-1g5cb-Na0uBY4ZvR2t0euIg9rONW3lBvaoDLqtn0/s1600/sign_up_button.png" id="sbutton"
        />
    </form>
</div>

2.

Copy and Paste the following code into HTML/Javascript for 'Design 2'.

<style type="text/css">
#widgetcraft-emailbox {
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs92A-Cs3DyWNa-_UHAzainyReb4xZWjKVdc12vhwvuDo1jJhGCb59a3LkmSOijCT81yOkA-zw1ok_FB_FEZqmynoqYhLYyi4Au_CAaARNDwPsqUKNfjg2nuh24sneS0l4HjjRN01qbHA/s1600/design2.jpg)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#widgetcraft-emailform {
    display: block;
    margin: 0;
    padding-left: 23px;
    padding-top: 83px;
}
form#widgetcraft-emailform #s {
    background: transparent;
    border: none;
    color: #444242;
    font-family: georgia;
    font-size: 15px;
    font-style: italic;
    height: 30px;
    margin-top: 0px;
    padding-left: -2px;
    vertical-align: top;
    width: 180px;
    outline:0px;
}
form#widgetcraft-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    margin-left:44px;
    padding-right:70px;
    }
</style>
<div id="widgetcraft-emailbox">
    <form id="widgetcraft-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FeedURL', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="FeedURL" 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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBNBUcaMzLKhRFpOLS5Jw-_0ArB8-QQWx_albsnjAbEsVMFw5y95NIjByLAljJ7D5X-YdryOOkI5Kixy5dsofxZnfjaYfHWV5S_vQiWMDB_PsvLO01nBsQRxtjezv1JhpfCtVW7KyAk4o/s1600/blank.gif" id="sbutton"
        />
    </form>
</div>

3.

For 'Design 3' Copy and paste the following code into HTML/Javascript.

<style type="text/css">
#widgetcraft-emailbox {
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHTaMUNe2F18wEcR9DdJg3aDDxgStsKpiJ68u42XKlX1yKHFF5th7T-rfa0rO3dG-e1YtjDPtra7nVOERSgNuMtD5QWtW3RcYVLWDAQDy0VP2I0lPg_-yrheOzg_xzrGHk8xvgbkcP5_U/s1600/design4.jpg)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#widgetcraft-emailform {
    display: block;
    margin: 0;
    padding-left: 23px;
    padding-top: 83px;
}
form#widgetcraft-emailform #s {
    background: transparent;
    border: none;
    color: #444242;
    font-family: georgia;
    font-size: 15px;
    font-style: italic;
    height: 30px;
    margin-top: 0px;
    padding-left: -2px;
    vertical-align: top;
    width: 180px;
    outline:0px;
}
form#widgetcraft-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    margin-left:40px;
    padding-right:87px;
    }
</style>
<div id="widgetcraft-emailbox">
    <form id="widgetcraft-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FeedURL', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="FeedURL" 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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBNBUcaMzLKhRFpOLS5Jw-_0ArB8-QQWx_albsnjAbEsVMFw5y95NIjByLAljJ7D5X-YdryOOkI5Kixy5dsofxZnfjaYfHWV5S_vQiWMDB_PsvLO01nBsQRxtjezv1JhpfCtVW7KyAk4o/s1600/blank.gif" id="sbutton"
        />
    </form>
</div>

 Replace 'Feed Url' with your Feed Burner Url. For example "http://feeds.feedburner.com/satelliteupdates/IMOF" is your feed burner url and "satelliteupdates/IMOF"  is your 'FeedUrl'.