How To Add Feedburner FeedFlare to Your SubText Blog

I started using FeedBurner.Com to power the RSS feeds for my blog and I am quite happy in doing so.  I like the stats they provide and the guidance they provide on various tweaks to the feed without having to re-code anything.  One of the items I added to the RSS feed and to the site is FeedFlare.  FeedFlare places a simple footer at the bottom of each entry which allows people to distribute the entry to other sites or to inform other users of an entry.

Step 1:  Configure your FeedBurner account for your blog

This may seem pretty obvious, but at the risk of someone being confused in order to do this, you have to create a FeedBurner account.  The cost is free.  Once you create an account and link up your feed which points to your real RSS feed on your site, configure it.   Select your blog via the control panel and click on the Optimize tab.  In the left menu select "FeedFlare" and configure the options you want.

There are two options:  Feed and Site.  By placing a check in one column or another will determine where the FeedFlare shows up.    By choosing the "Feed" option, it will place the particular flare chosen at the bottom of your feed as seen here from RSS Bandit.

Choosing the "Site" option will display the chosen flares in your web site next to each item as seen here:

Step 2:  Add any custom flares to FeedBurner

Once you are done configuring which built-in flare options you may want to add other flares.  In the FeedBurner FeedFlare section there is documentation on how to add additional flare items so I will not cover it in detail but I will give you a quick sample on how to add a flare for http://www.dotnetkicks.com.  Essentially you create an XML file which is uploaded to a web server.  Here is the XML to add the flare as seen above for Kick It!

    1 <FeedFlareUnit>

    2     <Catalog>

    3         <Title>Kick It!</Title>

    4         <Description>Submit this post to DotNetKicks.Com</Description>

    5     </Catalog>

    6     <FeedFlare>

    7         <Text>Kick It!</Text>

    8         <Link href="http://www.dotnetkicks.com/submit/?url=${link}"/>

    9     </FeedFlare>

   10 </FeedFlareUnit>

If you would like to use this particular one it is available here:  http://keithelder.net/feedflare/KickIt.xml

Step 3:  Modify SubText.Web.Skins.YourSkinName.Controls.Day.ascx control

I did some searching and couldn't find any examples on where to place the script needed to insert the feed flare under each entry.  I had to dig into the code a bit to find which variable was needed to get access to the URL of each entry from within the template.  And I had to find the template.

The control we are going to modify is the Day.ascx control which is located in the Skins/YourSkinName/Controls directory.  The variable that we need to place in our user control is "FullQualifiedUrl".  Since each item on the home page is printed using a Repeater we have to use the DataBinder.Eval to get each item's FullyQualifiedUrl property.  Here is the sample code you need to place in your Day.ascx user control.  Don't forget to modify the one associated with your skin and replace the word "yourname" with your appropriate FeedBurner name.

            <div>

                <script src="http://feeds.feedburner.com/~s/yourname?i=<%# DataBinder.Eval(Container.DataItem, "FullyQualifiedUrl") %>" type="text/javascript" charset="utf-8"></script>

            </div>

Once you have this placed in your template where you want it, upload your newly modified template to your web site overwriting the existing one.  You only need to copy this one file.  Reload your home page and your new flare should appear. 

«January»
SunMonTueWedThuFriSat
31123456
78910111213
14151617181920
21222324252627
28293031123
45678910