Attractive Feed Subscription Form Widget For Blogger

 

This is a Cool Rss Subscribe box. Actually if we hope to increase our Rss, we must have good article with attractive subscription gadget. Therefore visitors force to subscribe via Rss because they can get quality articles via emails. Earlier I posted about How To Add Search  Box With Subscriber Gadget For Blogger


1. Log in to blogger  Design > Page Element.

2. Click Add Gadget and select 'HTML/Javascript

3.Now Paste One of below code style as your like

Style 1

 <style type="text/css">
#btrix-emailbox {
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8vFwEc3cmm5iUBPXZ7FI4v4b0zKPnxRBdrNJnQf-w6bBXHd-Zh0Zf5MTlaCIarO7PlLrUWWFqztG7riKMpI8YVoOgPCty3SfWQqzhAtgjgP_uiSlk3q6ZwIdklOnku48-FHiLz5pwb98I/s1600/btrix-red.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}

form#btrix-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}

form#btrix-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#btrix-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</style>

<div id="btrix-emailbox">
    <form id="btrix-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="bloggertrix" 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>

Style 2

 

 

<style type="text/css">
#btrix-emailbox {
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8vFwEc3cmm5iUBPXZ7FI4v4b0zKPnxRBdrNJnQf-w6bBXHd-Zh0Zf5MTlaCIarO7PlLrUWWFqztG7riKMpI8YVoOgPCty3SfWQqzhAtgjgP_uiSlk3q6ZwIdklOnku48-FHiLz5pwb98I/s1600/btrix-red.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}

form#btrix-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}

form#btrix-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#btrix-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</style>

<div id="btrix-emailbox">
    <form id="btrix-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="bloggertrix" 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>

Style 3

 

 

 

<style type="text/css">
#btrix-emailbox {
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2eWaKvRJxuKrE9pjdRGXIkow6mcM7Y7rBR6GtB_30QOBzq19BbNqXgdPb7TIBMuOyKN4beCW9pvIJ3C0xWZbpfJkvOB32d9onAF1MN9QutZBnFaLFP3Q463VtEZavavAT3xqLtIkFCsSI/s1600/btrix.blue.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}

form#btrix-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}

form#btrix-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#btrix-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</style>

<div id="btrix-emailbox">
    <form id="btrix-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="bloggertrix" 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>

After paste one of above code
* Replace bloggertrix with your feedburner name

4. Now save your HTML/Javascript'.

    You are done...