Nov 23, 2012

Add Beautiful Rss Feed Subscription Box to Blogger,WordPress

Beautiful Rss Feed Subscription Box For Blogger WordpressBeautiful Rss Feed Subscription Box For Blogger,Wordpress
How to Add Beautiful,Simple Rss Feed Subscription Box For Blogger,WordPress
Today I am going to explain how to add a beautiful Rss Feed subscription box to blogger , WordPress using this simple widget HTML Code. users can add their emails and subscribe your Rss feed.This is a simple and  widget,So you can add it to your blog easily.This is compatible with every browsers.

  <style>
.bordered {
    border: solid #ff7417 2px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 1px 1px #ccc;
    -moz-box-shadow: 0 1px 1px #ccc;
    box-shadow: 0 1px 1px #ccc;       
}
.bordered2 {
height: 25px;
    background-color: #ff7417;
    -webkit-border-top-left-radius: 6px;
    -khtml-border-radius-topleft: 6px;
    -moz-border-radius-topleft: 6px;
     border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -khtml-border-radius-topright: 6px;
    -moz-border-radius-topright: 6px;
     border-top-right-radius: 6px;     
     text-shadow: 0 1px 0 rgba(255,255,255,.5);
     border-top: solid #ffffff 1px;
}
</style>
<div class="bordered">
<div class="bordered2">
<center>
<span style="color: #ffffff; font-size: 16px;"><b>Subscribe Now</b></span></center></div>
<a href="http://feeds2.feedburner.com/egytricks" rel="alternate" title="Subscribe now to avail the unthinkable" type="application/rss+xml"><img border="0" alt="" style=" padding-bottom:20px; margin: 0pt 10px 10px 0pt; float: left; width:100px; height:100px;" src="http://1.bp.blogspot.com/-4GQT-yxEq1g/UKnA17_kO8I/AAAAAAAABM4/F0o3EiCuzB8/s1600/RSS-Reader-Book-icon.png"/></a><p><a href="http://feeds2.feedburner.com/egytricks" rel="alternate" title="Subscribe to my feed" type="application/rss+xml">Get free email updates </a><span style="color: #ffffff; font-weight: bold;">By submitting your email address here</span></p>
<style>
input.bt {
color:#fff;
font: bold 10px Arial, sans-serif;
background:#ff7417;
border:0;
padding:3px;

}
input.bthov {
color:#fff;
font: bold 10px Arial, sans-serif;
border:2px solid #ff7417;
padding:3px;
}
</style>
<form action="http://feedburner.google.com/fb/a/mailverify" style="padding: 5px; " target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=egytricks', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input style=" color:#ffffff; background: #fff; border:1px solid #ff7417; width: 90px;" name="email" type="text"/>
<input value="egytricks" name="uri" type="hidden"/><input value="en_US" name="loc" type="hidden"/> <input onmouseover="this.className='bt bthov'" onmouseout="this.className='bt'" value="GO!" class="bt" type="submit"/></form><br/>
</div>

Now Replace egytricks with you Feed name/URL and #ff7417 with your HTML COLOR CODE

All done enjoy ...

Subscribe Updates, Its FREE!

0 comments:

Post a Comment

 

Copyright @ 2013 EgyTricks.

Designed by Vikash | EgyTricks