Adding a progress bar for AcBoWriMo

1 Nov

@Hist_Geographer asked me on twitter how I added the progress bar to my blog. The answer is a little too long for twitter so I thought I’d put it here:

Basically all you need to do is go to your appearance tab on wordpress, add a ‘text’ widget and edit the widget so that it includes the following text:

<div style=”width:175px;height:15px;background:#33FFFF;border:1px solid #000000;”>
<div style=”width:3.4%;height:15px;background:#00CCCC;font-size:8px;line-height:8px;”>
</div></div> 12,38/36,000 words. 3.4% done!

When ever you want to update the progress bar you just need to adjust the width of the second div (where it currently says width:3.4%) and then change the text you want to display under the progress bar (where is says 12,38/36,000 words. 3.4% done!)

You can do this with any blogging software that lets you add a widget that allows html


2 Responses to “Adding a progress bar for AcBoWriMo”

  1. Amy November 4, 2011 at 11:43 am #

    Thanks for that html work! It would have taken me way to much time to come up with it since my skills are pretty rusty. And happy writing, too.


  1. Sharing the love (or the pain): #acbowrimo-sters in arms — Goannatree - November 12, 2011

    […] Academic Writing Challenge – #AcBoWriMo Emily and the Lime: AcBoWriMo First Impressions; Adding a progress bar for AcBoWriMo – I used Emily’s tips and created the progress bar you see here on Goannatree!); […]

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: