Because Steph asked, I will show you the code I used to make the word counters in the sidebar. There are many others out there, like the NaNo counter, but I prefer this one because it is cleaner to add to a sidebar or a webpage.
In a text editor, like Notepad or (my favourite) Notepad++, open up a new file, and call it progress.php. Copy the code below, paste it into progress.php, and save.
<?php
// DO NOT USE A HASH MARK "#" AS PART OF A HEX PARAMETER!
// progress = progress bar colour (hex)
// border = border colour (hex)
// background = fill colour (hex)
//
//
// This code is released into the public domain. Do with it what you will.
// Function to Convert hex to a useable decimal array
function hex2decarray($hex_value)
{ // Chop it up, hexdec it
$dec_array = array(hexdec(substr($hex_value,0,2)),
hexdec(substr($hex_value,2,2)),
hexdec(substr($hex_value,4,2)));
return $dec_array;
}
/* page output starts here */
// Let the browser know a GIF is coming
Header("Content-type: image/gif");
// Grab the progress numbers
$target = $_GET['target'];
$current = $_GET['current'];
// Grab the hex colour codes - DO NOT USE A # in the parameter
$background = $_GET['background'];
$border = $_GET['border'];
$progress = $_GET['progress'];
// If we missed one, fill in the defaults
if (!$_GET['progress'])
$progress="2222DD";
if (!$_GET['border'])
$border = "000000";
if (!$_GET['background'])
$background="CCCCCC";
// If there isn’t a target number, this dodges a nasty divide-by-zero
if ($target==0)
{
$current = 0;
$target = 100;
}
// Percentages
$percent = (($current*100)/$target);
// If its over 100, write over the right-hand border
if ($percent > 100) $percent = 101;
// Width and height of the complete bar
if ($width == 0) $width = 102;
if ($height == 0) $height = 15;
// Calculate colour arrays
$bgc=hex2decarray($background);
$bc=hex2decarray($border);
$fc=hex2decarray($progress);
// Generate empty image
$image = ImageCreate($width,$height);
// Colours
$border = ImageColorAllocate($image,$bc[0],$bc[1],$bc[2]);
$back = ImageColorAllocate($image,$bgc[0],$bgc[1],$bgc[2]);
$fill = ImageColorAllocate($image,$fc[0],$fc[1],$fc[2]);
// Draw the border
ImageFilledRectangle($image,0,0,$width,$height,$border);
// Draw the background over that
ImageFilledRectangle($image,1,1,$width-2,$height-2,$back);
if ($percent > 0)
// Draw the progress bar over the background
ImageFilledRectangle($image,1,1,$percent,$height-2,$fill);
// Send the image to the browser
ImageGIF($image);
// Clean up
ImageDestroy($image);
?>
After you have saved it, upload progress.php to your webserver.
In the page where you want to show the counter, insert the following code:
<img src="http://LINKTOFOLDER/progress.php?current=#&target=100&progress=FFFFFF&background=000000&border=FF0000" />
Remember to change LINKTOFOLDER to the location your progress.php file actually is (http://disdainful-soul.net, for me), and # to whatever percent your progress is. If you don’t know how to calculate your progress, use this formula: (current/goal) x 100.
To change the colour scheme, change the first hex code (six digit number) for the progress, the second for background, and the last for the border.
And that is pretty much it. Enjoy! 
Originally published at Working Title. Please leave any comments there.
