Hacking University like Email Subscription Widget For Blogs

Blogger Widget,

Rate this posting:

{[['']]}

Add This To Del.icio.us Tweet/ReTweet This Share on Facebook StumbleUpon This Add to Technorati Digg This

Hello friend's

Today i am going to show you how to add Haking University Like Email Subscription Widget For Blogs. This email subscription widget is simply awsome. Email subsription widget is the most important widget for blog. It increases your readers, by allowing them to subscribe your blog.

Here is the demo of the widget:

How to add this email subscription widget

• Go to Blogger Dashboard>>Layout>>Add a gadget>>HTML/Javascript
• Now add the following code in it.

<style type='text/css'>#sidebar-subscribe-box{background:url( http://1.bp.blogspot.com/-IyEBRR8yOQQ /UBhYdBd23PI/AAAAAAAAFTU/aeW3JdAlrCs /s1600/colored-strip.png) repeat scroll 0 0 transparent;border:1px solid #aaa;border-radius:3px;padding:3px 0}.sidebar-subscribe-box-wrapper{background:url( http://2.bp.blogspot.com/-tUlo5p5gP8o /UBhYciGNgwI/AAAAAAAAFTM /x22pIuNLVPw/s1600/bg-pattern.png) repeat scroll 0 0 #f7f7f7;color:#111;font-size:14px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:uppercase}.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0}form.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto}.sidebar-subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#fff url( http://1.bp.blogspot.com/-JMYdQsIa9WQ /UDZqxqqrTEI/AAAAAAAAFho/AocEv70U8K8 /s1600/sprites.png) no-repeat 0 -27px;border:1px solid #ccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 40px;width:68%}.sidebar-subscribe-box-email-button{background:#09f;border:1px solid #007fff;box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent;color:#fff;cursor:pointer;font-family:verdana;font-weight:700;padding:10px;text-shadow:1px 1px 0 rgba(0,0,0,.4);text-transform:uppercase;width:100%}.sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#1ca4ff}.sidebar-subscribe-box-email-button:active{-moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;outline:0}iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);background:#FFF;border:1px solid #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4px 4px 4px}#footer-section{background:#f5f5f5 url( http://1.bp.blogspot.com/-n5s9Bu0JCgg /UA_AfQ5qLkI/AAAAAAAAFMU/G9FOuh4SP7k /s0/bg-pattern.png) repeat top left;border-top:1px solid #aaa;box-shadow:inset 0 4px 6px -3px #aaa;font-family:cambria;font-size:14px;height:100px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%}</style> <div id="sidebar-subscribe-box"><div class="sidebar-subscribe-box-wrapper"><p>Subscribe to our email newsletter & receive updates right in your inbox.</p><divclass="sidebar-subscribe-box-form"><form action=" http://feedburner.google.com /fb/a/mailverify?uri=blotricks" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open(' http://feedburner.google.com /fb/a/mailverify?uri=blotricks', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><inputname="uri" type="hidden" value="blotricks" /><input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Enter your email address :)"/><input class="sidebar-subscribe-box-email-button" title="" type="submit" value="Subscribe Now !" /></form></div></div></div>

• Now press ctrl+f and find "blotricks". Replace this with youe feed burner id.
• Now save it and view your blog.

HAPPY BLOGGING!

Get Free Updates in your Inbox

Follow us on: