Progress Bars and Blogger a How to

Crissy posted a comment on my last blog asking how I did the progress bars. Guess what it is easy as hell to do!!!

All you are doing is posting a list of pictures and changing the direct link to the picture as your progress increases.

The first thing you do is find yourself some pictures of progress bars. I've got a zip file with a bunch of them ranging from 0% to 100% that I found on the internet. I wish I remembered the address but I left that info at work. You could make your own using Microsoft PAINT or photoshop if you want (I want to do that eventually!).

Upload your progress bar pictures to you photo site (ie photobucket or flicker)
Next go to your blogger template.
On the new blogger add a Page element Html/Java Script.
Make your title for the element.
Type the title of your WIP then add the code for the progress bar picture.
Be sure to remove the part of the code that references the photo site. (those are just annoying)

Here is an example of the code for Norberta:
_strong_Current Norberta _/strong_ _br/_ <--Strong makes it bold and BR inserts line break
_img border="0" src="http://i101.photobucket.com/albums/m50/lesleyd271/Progress%20Bar/75perc.png"_ _br/_
(I had to remove the < > Where the _ is indicates the <>'s other wise it would just show the pic)
Add as many as you want. When the status on the project changes copy and paste over the link to the progress you want from you photosite.

That's it. Easy as pie and without crazy scripts and stuff to remember.
I hope that helps you out Crissy and anyone else that's been wanting to put progress bars on their page!