Tweet
Since blog engage is my favorite community, I thought why not promote it by using a look alike widget. That way more people will get to know of blog engage.
Their popup domination subscription form looks like this.
<style type="text/css">
html #blog_engagestylepopupdiv {position:absolute;}
#blog_engagestylepopupdiv {z-index: 999999;display:block; top:0px; left:0px; width:100%; height:100%; position:fixed; background-image:url('#');margin:0; overflow-y:auto;}
#blog_engagestylepopup {background-image: url(http://blogtipscodes.googlecode.com/files/Untitled.png); background-repeat:no-repeat; overflow:none;}
.blog_engagestylepopup {width:750px; height:334px; position:fixed; top:50%; left:50%; margin-top:-167px; margin-left:-396.5px;}
form#blog_engagestylepopup {display:block; margin:0;}
form#blog_engagestylepopup #blog_engagenamefield {padding:2px; position:absolute; top:120px; left:490px; width:205px; font-size:16px; border:none; background:transparent;}
form#blog_engagestylepopup #blog_engagefield {padding:2px; position:absolute; top:170px; left:490px; width:205px; font-size:16px; border:none; background:transparent;}
form#blog_engagestylepopup #blog_engagebutton {position:absolute; left:480px; top:218px; width:250px; height:42px; border:none; background:transparent;}
</style>
<div id="blog_engagestylepopupdiv">
<div id="blog_engagestylepopup" class="blog_engagestylepopup">
<center style="color:#000;cursor:pointer;float:right;margin-right:-20px;margin-top:-20px;" onmouseup="document.getElementById('blog_engagestylepopupdiv').style.display='none'">
<img src="http://blogtipscodes.googlecode.com/files/aweberclose.png"/>
</center>
<form id="blog_engagestylepopup" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogtipscodes', 'popupwindow', 'scrollbars=yes, width=600, height=550'); return true">
<input type="hidden" value="blogtipscodes" name="uri"/>
<input type="text" id="blog_engagenamefield" name="email" value="" placeholder ="Enter Your Name..." />
<input type="text" id="blog_engagefield" name="email" value="" placeholder ="Enter Your E-Mail Address..." />
<input type="hidden" name="loc" value="en_US" />
<input type="image" src="http://blogtipscodes.googlecode.com/files/popup.gif" id="blog_engagebutton" />
</form>
</div>
</div>
If you like this form, join blog engage. It's a great community for bloggers. You can share your views in the comment section.
Blog Engage is a paid community for bloggers where you can syndicate your content , gain backlinks , meet other bloggers and lots more. You can also earn money using their affiliate lights program. It is a community which every blogger should join.
Please note that this form is not in any way related to blog engage. It is only a customised feedburner form only meant for blogger. It's just a look alike using only HTML and CSS.
Like the previous aweber form, this one is also created using only html and css. The one I made looks exactly same. I'm working on a new form using jquery which I hope will be ready soon.
Note that since this form is only for blogger and being a customised feedburner form, the NAME field is only for display. It doesn't have any consequences whether someone fills it up or not.
To use this form, simply go to your blogger account.
>> Go to Layout --> Add a Gadget --> HTML / Javascript
Then copy the following code and paste it in the gadget. Now before saving the gadget make sure to change the feedburner username to yours.
Also, since this a customised feedburner form the name field in the form is just for display. You can write your name on it but it doesn't have any consequences. Only your e-mail address will be taken into account while subscribing for feedburner.
