In this tutorials,I will explain to you how create a Subscribe Box with Feedburner Email subscription,Feed subscription and Social networking buttons(Digg,Twitter,Facebook,Stumbleupon,Delicious).You can easily add or remove social buttons to this widget and setup your email subscription.If you like to add this widget to your blog or a website,then follow the steps given below.
1.Log in to your dashboard--> Design- ->Page Elements.
2.Click on 'Add a Gadget' on the sidebar.
3.Select 'HTML/Javascript' and add the code given below and click save.
<style type="text/css"> #subscribe-box { overflow: hidden; margin: 10px 0 0 0; } #subscribe-box a.subscribe-sec { display: inline-block; display: -moz-inline-stack; width: 40px; padding-top: 38px; zoom: 1; } #subscribe-box a.subscribe-sec:hover { color: #660000; } </style> <form action="http://feedburner.google.com/fb/a/mailverify" style="border:1px solid #ccc;padding:3px;" target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER-ID', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Get Notified When We Update !!!</p><p><input style="width:180px" name="email" type="text" value="Enter your email address:" onclick="this.value='';" /><input value="FEEDBURNER-ID" name="uri" type="hidden" /><input value="en_US" name="loc" type="hidden" /><input value="Subscribe" type="submit" /></p> <p><div id="subscribe-box"> <a title="Delicious" href="http://delicious.com/DELICIOUS-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMdy_q5LaNELDTTTTiGlr9g_D4mwCmLYvyc99Tg6fe5-lWRKiXAEujxqro9bdvb78hKfiOGYx70FHROkaTRONlAAa3uHQnu4GwyKyU45dGqKkmHbj0nylNK0fnKVZGfmUdYU-dy4Flg15A/s1600/delicious.png) center top no-repeat"></a> <a title="Twitter" href="http://twitter.com/TWITTER-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGBwMcPpxm7Z-l6hEB-6dqHjG3T9M1pW4WJI1LWfvM8BiprzMA_qf-SU8Jjr3EhgXxQxSf7Gs0R1WPRnOxDaM3UGNg4S9tlfceXzafthxp450lbtmCLIzVj0TraM6fnkxDOM3k7V88dJqe/s1600/twitter.png) center top no-repeat"></a> <a title="Digg" href="http://digg.com/users/DIGG-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbFvraeCSPpId-MMiYB-HopUBaqj7VIomyDFPD3NYiY3Oy89AukxkCcUP8sKEKmuYoVWDw8RyVxIGAtV46gWc4ycU8lay0-tnkxxPrZ3PrqyEQHgjDw3OtCdjQaXar9j-KqAO_9ICjj-bL/s1600/digg.png) center top no-repeat"></a> <a title="Facebook" href="http://www.facebook.com/FACEBOOK-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6JQAmtVjBrSpe0bAeThp3VzFMiruvHNNlZ3X7Dw996paYbvnSJGUwgbdEzeaBsXKWC90k1PyTDJH4CQOM1iaHblQGdM1DF2pqQKabmyDChBbPckmfcYb4IVK3uU8jmGo2dkkjuwTaLYNM/s1600/facebook.png) center top no-repeat"></a> <a title="Stumbleupon" href="http://www.stumbleupon.com/stumbler/STUMBLEUPON-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3i4SKhBRF5v-HKH_HB6oxdXlnDGgIH8FfBaPdmdKfa98yx_b1FV615YhFqkt4PMHtknknIxFgz4tF5IYU93cT_adb5d2uu9KAK2KMZq7NF5JIVCUyRzfDlatlL9lUZ7Y6nqb73xxYyZva/s1600/stumbleupon.png) center top no-repeat"></a> <a title="RSS Feed" href="http://feeds.feedburner.com/FEEDBURNER-ID" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkThaXC3RLegdpb2mzj9EMh6b0d2fK3FhyphenhyphenzctNGhWzP68GLsgACqbRijm0k8lmYGF3UzkJbQfBd1hdaBzBecMWuKlZEe0mROgK7nR3X55fbshOUETok44qD3fVGZfpTo_sWAvEPVZaDkqY/s1600/rss.png) center top no-repeat"></a> </div></p> </form>
Note : Remember to REPLACE,
FEEDBURNER-ID with your feedburner ID.
DELICIOUS-USERNAME with your delicious username.
TWITTER-USERNAME with your twitter username.
FACEBOOK-USERNAME with your facebook username.
STUMBLEUPON-USERNAME with your stumbleupon username.
Look at the example given below.
<style type="text/css"> #subscribe-box { overflow: hidden; margin: 10px 0 0 0; } #subscribe-box a.subscribe-sec { display: inline-block; display: -moz-inline-stack; width: 40px; padding-top: 38px; zoom: 1; } #subscribe-box a.subscribe-sec:hover { color: #660000; } </style> <form action="http://feedburner.google.com/fb/a/mailverify" style="border:1px solid #ccc;padding:3px;" target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogspot/WyNa', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Get Notified When We Update !!!</p><p><input style="width:180px" name="email" type="text" value="Enter your email address:" onclick="this.value='';" /><input value="blogspot/WyNa" name="uri" type="hidden" /><input value="en_US" name="loc" type="hidden" /><input value="Subscribe" type="submit" /></p> <p><div id="subscribe-box"> <a title="Delicious" href="http://delicious.com/wam8387" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMdy_q5LaNELDTTTTiGlr9g_D4mwCmLYvyc99Tg6fe5-lWRKiXAEujxqro9bdvb78hKfiOGYx70FHROkaTRONlAAa3uHQnu4GwyKyU45dGqKkmHbj0nylNK0fnKVZGfmUdYU-dy4Flg15A/s1600/delicious.png) center top no-repeat"></a> <a title="Twitter" href="http://twitter.com/btipandtrick" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGBwMcPpxm7Z-l6hEB-6dqHjG3T9M1pW4WJI1LWfvM8BiprzMA_qf-SU8Jjr3EhgXxQxSf7Gs0R1WPRnOxDaM3UGNg4S9tlfceXzafthxp450lbtmCLIzVj0TraM6fnkxDOM3k7V88dJqe/s1600/twitter.png) center top no-repeat"></a> <a title="Digg" href="http://digg.com/users/wam8387" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbFvraeCSPpId-MMiYB-HopUBaqj7VIomyDFPD3NYiY3Oy89AukxkCcUP8sKEKmuYoVWDw8RyVxIGAtV46gWc4ycU8lay0-tnkxxPrZ3PrqyEQHgjDw3OtCdjQaXar9j-KqAO_9ICjj-bL/s1600/digg.png) center top no-repeat"></a> <a title="Facebook" href="http://www.facebook.com/btipandtrick" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6JQAmtVjBrSpe0bAeThp3VzFMiruvHNNlZ3X7Dw996paYbvnSJGUwgbdEzeaBsXKWC90k1PyTDJH4CQOM1iaHblQGdM1DF2pqQKabmyDChBbPckmfcYb4IVK3uU8jmGo2dkkjuwTaLYNM/s1600/facebook.png) center top no-repeat"></a> <a title="Stumbleupon" href="http://www.stumbleupon.com/stumbler/wam83879" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3i4SKhBRF5v-HKH_HB6oxdXlnDGgIH8FfBaPdmdKfa98yx_b1FV615YhFqkt4PMHtknknIxFgz4tF5IYU93cT_adb5d2uu9KAK2KMZq7NF5JIVCUyRzfDlatlL9lUZ7Y6nqb73xxYyZva/s1600/stumbleupon.png) center top no-repeat"></a> <a title="RSS Feed" href="http://feeds.feedburner.com/blogspot/WyNa" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkThaXC3RLegdpb2mzj9EMh6b0d2fK3FhyphenhyphenzctNGhWzP68GLsgACqbRijm0k8lmYGF3UzkJbQfBd1hdaBzBecMWuKlZEe0mROgK7nR3X55fbshOUETok44qD3fVGZfpTo_sWAvEPVZaDkqY/s1600/rss.png) center top no-repeat"></a> </div></p> </form>
You are done.
share this post and share your knowledge... give more get more..
Comments
Post a Comment
Please Leave Your Comments