Get a free blog widget for your site
Help yourself to my free blog widget - use it for your own site
Would you like a free blog widget similar to the one shown on the right of this page? If your website includes an RSS feed and you know the name of the XML file that provides the feed, you can install such a widget within minutes. No ads on the widget (other than a small link at the bottom to this page on my site, so others can figure out how to do it too), and best of all, you can customize it to your heart's content.
The widget reads your RSS feed XML file each time a page containing the widget is displayed. It displays the heading and first few words of each of the most recent few updated pages. You can control how many words of heading and text, and how many updated pages.
I use SBI or Site Build It! to run my website, and if you do too, you'll find it very easy to install this widget. I've tailored the directions below for my fellow SBI owners (SBIers help each other out a lot!) but if you are a little Web savvy you should be able to figure it out even if you don't use SBI. Note that these directions are for SBI owners who upload their own HTML; if you use BlocKBuilder, I'm not sure you'll be able to get this to work. Also, this widget assumes you have a three column layout.
Here's what you need to do to customize this widget:
- Add some entries to your website style sheet. Normally, for SBI! owners, this file is in support-files/style.css. If you want, you can instead put the appropriate style statements inside the SHTML file that contains the widget itself. You can also edit the style settings to work for your particular site design and your own preferences.
- Include the SHTML file in the third column <div> tag of any page you want to show this blog roll.
Style sheet entries
You need to add the following style sheet entries to your site-wide style sheet. If you don't want to or can't modify that style sheet, then instead add the text <style type="text/css"> before the snippet below, and </style> after it. To select the text in the box below, then do Select All (Windows users: press Ctrl+A) and then Copy.
Note that you may want to change the 'color' tags and perhaps some of the width and height tags, depending on the effect you are looking for.
Create an SHTML file (I call mine blog-widget.shtml) that contains the following text (again, copy the contents of the box below and paste into the SHTML file):
You will need to change the value within quotes for the first variable shown (xmlFile) to match the name of your RSS feed. Do not use the full URL (http://mysite.com/myfeed.xml), instead just the file name (myfeed.xml). You can also change the values for maximum items, and maximum character length of the titles and descriptions of each entry.
Add some code in your third column
At the top of your third colum (typically also stored inside an SHTML include file), add the following right after the third column <div> tag:
I hope you don't mind my sticking a link to this page (the page you're on) in your widget - it's my way of helping more people find out about this widget. I've tried to make it very unobtrusive and it's the only favor I ask of you in exchange for your using this widget. Please note the license terms below.
Include the feed SHTML file
Now all you have to do is include the SHTML file containing the feed script, at the end of the BODY section of each HTML file (after the third-column divs you added above). One way to do this is, if you already have a footer.shtml file that gets included right before the </body> tag, just add the feed SHTML file there. Or, to try it on just one page at a time, add an extra include statement. For SBI! users, an include statement looks like this:
Where myfeed.shtml is the name of the include file containing the feed script.
That's it - you're good to go!
Feel free to contact me if you have any feedback - compliments, complaints, questions, suggestions. I'll try to keep enhancing it as time goes by, assuming people find it useful.
Green Energy Efficient Homes, the author for legal purposes of the blog widget described here, grants you a full license to use and modify this widget free of any charges, on any website of your choosing, provided you maintain and do not modify the link in the widget back to this page. Green Energy Efficient Homes makes no warranties whatsoever about this widget, and any disclaimers in the disclaimers page of our website also apply to the widget!