Remove Feedburner Logo From Buzzboost Widget

Feedburner Buzzboost Widget lets you display headlines of your recent posts or recent comments using your RSS Feed. It republishes your Fe...

Feedburner Buzzboost Widget lets you display headlines of your recent posts or recent comments using your RSS Feed. It republishes your Feed as HTML. By default the widget includes a credit at footer that says "Headlines By Feedburner" It was not that difficult to find a way for it after I expanded the JavaScript code and this code provided access to all CSS IDs and classes. Our next post would be on how to completely customize the appearance of buzzboost by editing the default styles. We will learn also in detail on how to change the bullet style, font size and colors etc. Lets now remove the logo "Headlines by Feedburner"

Before:

 

After:

Remove Feedburner Logo

The Feedburner code for recent posts looks similar like this:

<script src="http://feeds.feedburner.com/TntByStc?format=sigpro" type="text/javascript"></script>

 

The code for your recent comments look like this,

<script src="http://feeds2.feedburner.com/tntcomments?format=sigpro" type="text/javascript"></script>

You just need to add the following code above the code of either Recent posts or Recent comments (you don't need to add it twice),

<style>

/* Removes Buzzboost Logo (MBT) */

div  #creditfooter{
display: none;
}

</style>

 

The Resulting code should look something like this:

<style>

/* Removes Buzzboost Logo (MBT) */

div  #creditfooter{
display: none;
}

</style>

<script src="http://feeds.feedburner.com/TntByStc?format=sigpro" type="text/javascript"></script>

 

Save your widget and visit your blogs to see it working just fine.  Have Fun! :)

How it works?

For Web Designers:

The javascript that loads the widget looks contains the CSS classes and IDs for everything that appears inside Buzzboost. The JavaScript code provided by feedburner looks like the following:

 

And upon expansion it gives you the access to all data requeired to completely customize the look of the widget:

document.write("\x3cdiv class\x3d\x22feedburnerFeedBlock\x22 id\x3d\x22BurnThisRSS29e7afepqu1thh06o0bqpv4csjg\x22\x3e"); document.write("\x3cul\x3e"); document.write("\x3cli\x3e\x3cspan class\x3d\x22headline\x22\x3e\x3ca href\x3d\x22http://adsenseforfeeds.blogspot.com/2010/10/your-stats-right-away.html\x22 target\x3d\x22_blank\x22 \x3eYour stats, right away\x3c/a\x3e\x3c/span\x3e"); document.write("\x3cp class\x3d\x22date\x22\x3e10/25/2010\x3c/p\x3e"); document.write("\x3c/li\x3e"); document.write("\x3cli\x3e\x3cspan class\x3d\x22headline\x22\x3e\x3ca href\x3d\x22http://adsenseforfeeds.blogspot.com/2010/04/enabling-social-sharing-with-feedflare.html\x22 target\x3d\x22_blank\x22 \x3eEnabling social sharing with FeedFlare\x3c/a\x3e\x3c/span\x3e"); document.write("\x3cp class\x3d\x22date\x22\x3e4/23/2010\x3c/p\x3e"); document.write("\x3c/li\x3e"); document.write("\x3cli\x3e\x3cspan class\x3d\x22headline\x22\x3e\x3ca href\x3d\x22http://adsenseforfeeds.blogspot.com/2009/12/socializing-your-feed-with-twitter.html\x22 target\x3d\x22_blank\x22 \x3eSocializing your feed with Twitter\x3c/a\x3e\x3c/span\x3e"); document.write("\x3cp class\x3d\x22date\x22\x3e12/14/2009\x3c/p\x3e"); document.write("\x3c/li\x3e"); document.write("\x3c/ul\x3e"); document.write(" \x3cdiv id\x3d\x22creditfooter\x22\x3e\x3ca href\x3d\x22http://www.feedburner.com\x22 target\x3d\x22_blank\x22\x3e\x3cimg src\x3d\x22http://www.feedburner.com/fb/images/buzzboost-pwrd.gif\x22 alt\x3d\x22Headlines by FeedBurner\x22 style\x3d\x22border:0\x22/\x3e\x3c/a\x3e\x3c/div\x3e"); document.write("\x3c/div\x3e");

 

The credit footer ID is responsible for the appearance of the logo image in gif format which has the following URL: http://www.feedburner.com/fb/images/buzzboost-pwrd.gif

I simple added the display none property to completely deactivate this div section and this worked well.

Stay tuned for some amazing new custom styling tricks that will turn Feedburner into a much more professional looking plugin.