Flat style is the need of the hour.It has become more than a trend in this modern world of designing.Most of the popular website owners have switched to flat style. Wordpress site users are using flat template's to suit today's world.So why should we bloggers stay behind.Let's rock and roll.Inspired from a psd file , I have come up with this awesome flat style.I hope you guys do use it in your blogs.
It is build on CSS using the original feedburner code.Hence it's just a skin for feedburner subscribe box.
Features
- Flat style used
- Built on original feedburner code for flexible usage
- Can adapt to width sidebar
- Easy to use change color combinations
- Use of bundle effect and images to catch the reader's eye
Add This To Your Sidebar
- Go to Blogger > Login > Layout
- Navigate to Add a Gadget and paste this code in it
<div class="bxperts-style"><div class="bxperts-strip"><form style="padding:3px;text-align:center;" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bxperts', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><br/><div class="bxperts-text"><b>Subscribe to our newsletter</b></div><br/><div class="info">Always free ! We hate spam as much as you do.</div><p><input type="hidden"type="text" style="width:140px" name="email"/></p><input type="hidden" value="bxperts" name="uri"/><input type="hidden" name="loc" value="en_US"/><input class="newsletter-bxperts" type="text" style="width:60%" name="email"/><br/><input type="submit" value="Subscribe" /></form></div><div style="float:right;font-size:12px;text-transform:uppercase;"><a href="http://goo.gl/bglra5">Get This</a></div><style>.bxperts-style{background: #FAFAFA;box-shadow: 0 1px 1px rgba(0,0,0,0.15), /* The top layer shadow */ 0 10px 0 -5px #eee, /* The second layer */ 0 10px 1px -4px rgba(0,0,0,0.15), /* The second layer shadow */ 0 20px 0 -10px #eee, /* The third layer */ 0 20px 1px -9px rgba(0,0,0,0.15);width:90%;height:280px !important;}.bxperts-strip{width:100%;height: 10px;background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQzsoYr5F_PdAex_rFQFtGyhwQslyZ9eog2gPRjl33wOgvJpGL9LiEzzA3x3DwHcLjxFfv9v3OPyzihs1ns-YaXCcSEcQYvNwD57unCna85mTKWKFyJ_7mqZsrUkWec1SQsYFF5I2zLGvD/s1600/subscribe-pattern.png") repeat-x;}.bxperts-text{font-size:20px !important;line-height:1.5em!important;text-transform:uppercase!important;color:#666666!important;text-transform: uppercase!important;font-family: 'Open Sans', sans-serif!important;}.newsletter-bxperts{border: none;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji-ozkP1dh1kN3fn8NSaAasWSIJ5GcssezTBDz2e3QmHEToc3Lj5iUI-0p8zJ92x6U5g9xWCk3KaFA1GrP9iZyRk7uCXPz6kLkKnbuLUowh1505hXvAVe0TalUUll5_Qtzx1v07EQxRSqI/s1600/news-img.png) no-repeat left center #fff;width: 80%;height: 45px;font-family: 'Open Sans', sans-serif;font-size: 15px;font-weight: normal;color: #d4dadf;border-radius: 5px;outline: none;padding-left: 60px;margin-left: auto;margin-right: auto;border-style:solid;border-width:1px;}.newsletter-bxperts:focus {border-color:#333 !important; }input[type=submit] {background:#85C15D;padding-top:16px;padding-bottom:16px;padding-left:12px;padding-right:12px;color:#fff !important; border:0 none;border-radius: 5px;text-transform:uppercase;font-size:15px;margin-top:15px;}.info{font-size: 15px;font-family: 'Open Sans', sans-serif;color: #333;text-align: center;width: 80%;clear: both;margin-left: auto;margin-right: auto;margin-bottom:10px;}</style>
Change the highlighted words (bxperts) to your feedburner ID.
Save the layout and you are done.
EmoticonEmoticon