Wednesday, 15 August 2012

Stylish Email Subscription Forms For Blogger

Important: All scripts hosted on widcraft.googlecode.com don't work anymore because Google has blocked that SVN repository.

Get your followers stick to your blog with Rss feed subscription forms and today i'am going to post three amazing forms for your blog and site. No doubt this is the coolest set i have ever seen in my blogging life.

How To Add :

  • Go To Blogger > Layout > Add A Gadget > HTML/JavaScript
  • Post any of the script given below
Form Code #1 :

<style type="text/css">
#widgetcraft-emailbox {
    background: url(http://3.bp.blogspot.com/-ZQxEIyH71OI/UCuPrRX7MUI/AAAAAAAAJzk/EvB07JqLux8/s1600/Grey.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#widgetcraft-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}
form#widgetcraft-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;
    outline:0px;
}
form#widgetcraft-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</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="http://3.bp.blogspot.com/-D4DL8TMRtd0/UCuQt-AVn3I/AAAAAAAAJz8/K1sjzXIxyQk/s1600/blank.gif" id="sbutton"
        />
    </form>
</div>

Form Code #2 :

<style type="text/css">
#widgetcraft-emailbox {
    background: url(http://3.bp.blogspot.com/-IF2M5MNo0po/UCuP6M2t2bI/AAAAAAAAJzs/qmVUFW4vbPg/s1600/Red.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#widgetcraft-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}
form#widgetcraft-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;
    outline:0px;
}
form#widgetcraft-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</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="http://3.bp.blogspot.com/-D4DL8TMRtd0/UCuQt-AVn3I/AAAAAAAAJz8/K1sjzXIxyQk/s1600/blank.gif" id="sbutton"
        />
    </form>
</div>

Form Code #3 :

<style type="text/css">
#widgetcraft-emailbox {
    background: url(http://4.bp.blogspot.com/-UqbpRysFyWI/UCuQcydVI7I/AAAAAAAAJz0/amuxCmbmKZI/s1600/Blue.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#widgetcraft-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}
form#widgetcraft-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;
    outline:0px;
}
form#widgetcraft-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</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="http://3.bp.blogspot.com/-D4DL8TMRtd0/UCuQt-AVn3I/AAAAAAAAJz8/K1sjzXIxyQk/s1600/blank.gif" id="sbutton"
        />
    </form>
</div>
Final step just replace FeedURL with your feed's url.....for example if your feed address is feeds.feedburner.com/WidgetCraft then WidgetCraft is your feedurl.
Important: Check our new website TricksPanda.com for WordPress tutorials, plugins and more.
 
Powered by Blogger.