Need a free blog widget?

Got an RSS feed? Get our free blog widget for your site!

If you have an RSS feed associated with your website or blog, our free blog widget will allow you to display it on your web page in a matter of minutes. Provided that you can tell us the name of the XML file that provides your RSS feed, our handy code generator will do the rest for you.

All that we ask in return is that you allow us to include a discreet link back to this page, so that other webmasters can find out about our widget too.

Here's what our RSS feed, Build a Website News, looks like when displayed using our widget with the default parameter values, but there are lots of ways in which you can customise its appearance. We'll show you the effects of any changes as you make them.

If you can't see the preview, it means that you don't have
JavaScript enabled in your browser.
We're sorry that you won't be able to use our
free blog widget code generator.

How do I install the free blog widget?

It's really easy. Just follow our simple three-step process:

Customise the widget using the form below.
Copy and paste the generated code to the recommended locations.
Publish your page to the web.

Customise the widget

All that we really need to know is the name of the XML file that provides your RSS feed, but there are a number of other customisation options available. Hover your pointer over the buttons to see an explanation of how to use each form field.

Please enter the file references accurately, as the widget won't work properly unless you do.

RSS feed filename	Enter the URL of your RSS feed file, omitting http://www.domain.com/. For security reasons, the RSS feed file must be hosted on your own site, and not (for example) at FeedBurner.
Headline text	Enter the headline that should appear above the blog entries.
Show RSS button?	Check here to show a button link to your RSS feed in the headline area.
Number of blog entries	Enter the number of blog entries to be shown, between 1 and 50 inclusive.
Number of characters in blog entry title	Enter the maximum number of characters to appear in the blog entry title.
Remove date?	If your blog entry title begins with the date in the format Jan 31, check here to remove the date before displaying the title. If you use SiteSell's RSS/Blog It! module and have chosen to add the date to each blog entry, check here to remove the date before displaying the title.
Number of characters in blog entry description	Enter the maximum number of characters to appear in the blog entry description.
Include a Read All link?	Check here to include a link to a page where visitors can read all of your blog entries.
Link text	Enter the link text for your Read All link.
Link URL	Enter the URL of the page where visitors can read all of your blog entries.

When you've successfully submitted your customisation choices, you'll see that the example preview near the top of the page has been changed to reflect those choices, and further down the page you'll find your customised blog widget code.

CSS stylesheet entries

The following CSS stylesheet entries control the appearance of your blog widget, and you should add them to your stylesheet file. If you use the SiteSell Site Designer you may do this easily using the Add Custom CSS button.

If you can't or don't wish to modify your stylesheet, you may instead place the code between <style type="text/css"> and </style> tags in the <head> of your page [see below]. To select the code to be copied, simply click anywhere within the text box.

#blogWidget {
  width:95%;
  margin:10px auto;
  border:2px solid #5292d2;
}
#blogWidget #blogHead {
  background-color:#5292d2;
  color:#fff;
  font-weight:bold;
  padding:3px 5px 5px 5px;
  text-align:left;
}
#blogWidget #blogHead img {
  float:right;
  vertical-align:middle;
}
#blogWidget #blogBody {
  background-color:none;
  color:#000;
  font-weight:normal;
  padding:10px 10px 5px 10px;
  text-align:left;
}
#blogWidget #blogBody p.blog-item {
  margin:0px 0px 5px 0px;
}
#blogWidget #blogBody .bloglink {
  font-weight: bold;
}  
#blogWidget #blogBody a:link {
  color:#03d;
  text-decoration:none;
}
#blogWidget #blogBody a:visited {
  color:#900;
  text-decoration:none;
}
#blogWidget #blogBody a:hover {
  color:#c00;
  text-decoration:underline;
}
#blogWidget #blogBody a:active {
  color:#c00;
  text-decoration:none;
}
#blogWidget #blogFooter {
  background-color:#5292d2;
  font-weight:normal;
  font-size:85%;
  padding:5px 5px 5px 5px;
  text-align:left;
}
#blogWidget #blogFooter a:link {
  color:#fff;
  text-decoration:none;
}
#blogWidget #blogFooter a:visited {
  color:#fff;
  text-decoration:none;
}
#blogWidget #blogFooter a:hover {
  color:#fff;
  text-decoration:none;
}
#blogWidget #blogFooter a:active {
  color:#fff;
  text-decoration:none;
}

The CSS stylesheet entries as supplied will give your blog widget the appearance of the example preview shown above. You may of course make any changes that you wish to customise the widget to your own taste.

Page <head> code

You should add the following code to the <head> of the pages on which you wish to display the widget. If you're using SiteSell's SiteBuilder click the Head button, and add the code to the This Page Only section. If you don't have access to the <head> of your page, make sure that you place the code on the page before the blog widget code that appears below.

<script src="http://www.builda-website.net/support-files/blogwidget.js" type="text/javascript"></script>

Blog widget code

This is your customised blog widget code. Place it on your page wherever you would like the widget to appear.

That's it! You've finished!

Just publish your page to the web, and you'll have our free blog widget installed and working on your site. We hope that you will find it useful. Remember that it will work only on the site with which the RSS feed file is associated.

See our free blog widget installed on a page built using the BB2 SiteBuilder.

Terms and Conditions of Use

You may modify and use this blog widget royalty-free on any website of your choice, provided that you retain unchanged both the link back to this page and the comment that precedes it. We do not warrant either that the widget code is error-free, or that any error therein will be corrected.