This is a fully responsive and Html 5 powered subscription box so its recommended for you.
Providing visitors with easy and clean options to subscribe and bookmark should always be your first priority. I managed to design a simple box using CSS3 gradient and text shadow effect to create a container with RSS form inside it. The widget will stick to the bottom of your post and will let your visitors to submit their email addresses and subscribe to your FEED updates. Surely the best way to draw attention!
HOW TO ADD THIS WIDGET-
1- Go to blogger >> Template >>Edit HTML
3- Find <data:post.body/>
4- Just Below It Paste The Following Code-
<style>5- Replace http://feedburner.google.com/fb/a/mailverify?uri=ngtechzone with your feedburner url OR Replace ngtechzone with your feed title.
#ngtechzone-sub-box{background: -webkit-gradient(linear, left top, left bottom, from(#333), to(#1a2638));;border:1px
solid #1A2638;border-radius:10px; margin-bottom:10px;padding:10px;text-align:center;background: -moz-linear-gradient(top, #333, #1a2638)}
#ngtechzone-sub-box h1{margin-top:5px; color:#FFF;font-family:georgia;font-size:25px;margin-bottom:5px;padding:0;text-shadow:0 2px 3px #000;line-height:35px}
#ngtechzone-sub-box input{background: -moz-linear-gradient(center top , #FFFFFF, #EFEFEF) repeat scroll 0 0 transparent;border:medium none;border-radius:10px 10px 10px 10px;font-size:14px;padding:10px;text-shadow:1px 1px 0 #FFF;width:280px; color:#666; font-family:georgia; margin-bottom:5px;}
#ngtechzone-sub-box .submit{background: -webkit-gradient(linear, left top, left bottom, from(#369a18), to(#205f0d));background: -moz-linear-gradient(center top , #369A18, #205F0D) repeat scroll 0 0 transparent;color:#FFF;cursor:pointer;font-weight:bold;margin-left:20px;text-shadow:0 1px 2px #000;width:120px; font-family:georgia; margin-left:5px;}
#ngtechzone-sub-box .submit:hover{background: -moz-linear-gradient(center top , #46B725, #205F0D) repeat scroll 0 0 transparent}
#ngtechzone-sub-box .submit:active{background: -moz-linear-gradient(center top , #46B725, #205F0D) repeat scroll 0 0 transparent}
</style>
<b:if cond='data:blog.pageType == "item"'>
<div id='ngtechzone-sub-box'><h1>Subscribe To Get FREE Tutorials!</h1><form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=ngtechzone', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'><center> <input name='email' onblur='if (this.value == "") {this.value = "Enter Your Email Address...";}' onfocus='if (this.value == "Enter Your Email Address...") {this.value = ""}' size='30' type='text' value='Enter Your Email Address...'/> <input name='uri' type='hidden' value='tntbystc'/> <input name='loc' type='hidden' value='en_US'/> <input class='submit' type='submit' value='Subscribe'/></center></form></div>
</b:if>
6- Finally Save Your Template And Enjoy this beautiful widget :)
FROM THE AUTHOR:
Hope you liked this widget and may this widget increase your subscribers and good luck :)
If you face any problem just drop a line in comments or contact me.
No comments:
Post a Comment
PLEASE NOTE:
We have Zero Tolerance to Spam. Spammy Comments and Comments with Links will be deleted immediately upon our review.
For More Rules Read Our Comment Policy