b61f8e1bd91a260ea632f65d0d711764

How to Add Stylish Feed Subscription Box at Sidebar

by Rishi on October 22, 2009

in Blogging

If you want to add Stylish Subscribe Corner in Sidebar, then this is a nice place to make your Blog’s Sidebar RSS friendly. It is simple and easy, and includes Social Profile Buttons also like Twitter Profile, Facebook Profile and Email Subscription. But the code below is not fully ready, and needs some of your effort to look better. Let’s start with the content now, all you need to copy and paste this HTML Code below into your sidebar(s).

<html>
<body>
<br>
<div id="subscribe_widget" class="widget">
<form style="border:1px solid #ccc;padding:4px;
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=feedblogger',
 'popupwindow',
 'scrollbars=yes,width=700px,height=700px');return true">
<a href=http://feeds.feedburner.com/feedblogger>
<img src="http://problogger.isgreat.org/wp-content/uploads/rss_bar.png"
width=230 height=30></a>
<p>Enter your email address:</p>
<p><input type="text" style="width:250px" name="email"/></p>
<input type="hidden" value="feedblogger" name="uri"/>
<input type="hidden" name="loc" value="en_US"/>
<input type="submit" value="Sign Up" />
<br>
<hr>
<div align="center">
<a href="http://feedburner.google.com/fb/a/mailverify?uri=feedblogger"
<img src="http://problogger.isgreat.org/wp-content/uploads/widget_feedBurner2.png"
width=75 height=75 alt="Subscribe for Email Updates"></a>
<a href="http://twitter.com/rishi3594"
<img src="http://problogger.isgreat.org/wp-content/uploads/twitter-logo.jpg"
width=80 height=80 alt="Follow me on Twitter"></a>
<a href="http://www.facebook.com/apps/application.php?id=152785287073"
<img src="http://problogger.isgreat.org/wp-content/uploads/facebook-logo-square-webtreatsetc.png"
width=85 height=85
</a>
<hr>
</form>
</body>
</html>

The hard thing is that you have to change the Top Most Coding (preview) and the links

(preview) to your Blog’s related links. Below are the steps to change these links to You Blog’s corresponding links:-

1)Replace the Top Most Code (preview) to your FeedBurner Email Subscription Code. To find this code, First open your FeedBurner   account and click on Publicize tab. Then click on Email Subscriptions from the sidebar. You will see code followed by the Sub-Heading Subscription from Code as shown below.

subscription

Copy that code and paste it in place of code written like (preview).

2)In place of the link http://feedburner.google.com/fb/a/mailverify?uri=feedblogger,place your Feed URL. To find it, first click on Edit Feed Details and copy the whole URL as in image is http://feedburner.google.com/fb/a/mailverify?uri=feedblogger.Replace all same URLs with your Email Subscription Links.

link

3)Then , In the coding, there is text rishi3594 which links to my Twitter Profile. If you are Twitter user than You can change rishi3594 with your Twitter ID.

4) Last Step includes your Blog’s Facebook Community, copy your Blog’s Facebook Community URL and paste it in place of http://www.facebook.com/apps/application.php?id=152785287073 .

This is how your Feed Subscription box will look like

preview

A good appealing subscription box will be very appealing and help you to get more Email capture and subscribers.

Editors note : This is a Guest post by Rishi from ProBlogger, if you like to write for shoutmeloud, Read : Write for shoutmeloud .

Related posts:

  1. How to Configure Free Email Subscription Offer in Feed Burner
  2. Get Most out of Feed Burner Free Email Subscription Offer
  3. Email Subscription offer : A must have for all the bloggers
  4. Roundup of Social Media and Feed Subscription WordPress Plugins
  5. How to Burn your Feed using Feedburner
  6. Add more Social Touch to Feed Flare FeedBurner Options
  7. [Blogger tips] Change your Email delivery time for RSS feeds in feedburner
  8. Feed subscription reminder for wordpress

Do you like this story?

Wpfreelancer

{ 7 comments… read them below or add one }

1 Chethan October 22, 2009 at 18:20

In the screenshot shown above, why is facebook logo made Green color??
I like The Original Blue Colored Facebook Logo..

Reply

2 IndianCashMaker October 22, 2009 at 22:02

awesome post harsh…..i loved it…just RTed it

Reply

3 Rishi October 23, 2009 at 17:11

@ Chethan
It depends upon you to choose the Image.You can replace that Facebook Logo with the Image links in the coding.
@IndianCashMaker
This Post is Written By Me.

Reply

4 tips4trade team October 31, 2009 at 22:47

really nice and stylish feed subscription box, hope you also like subscription box on our website.

Reply

5 Tinh November 6, 2009 at 15:46

Is this working on Thesis too?

Reply

6 Manish Chauhan November 16, 2009 at 21:46

I just read this Post and used it on my blog .. I have made some changes customized to My blog .. have a look .

Manish

Reply

7 tanveer December 12, 2009 at 20:54

hi bro please help me in putting dis email subscirption. i tried but i m not getting it can u tell me v have to edit in HTML or else v need to create new html in posting ?

my blog doesn’t have email subscription so can u tell me the step by step process please. it’s a humble request

Reply

Leave a Comment

Previous post:

Next post:

ShoutMeLoud on Twitter ShoutMeLoud on Facebook ShoutMeLoud RSS Feed