Sunday, 20 January 2008


Sorry for the technically oriented post but a number of people have asked me how to use my word meters. Hopefully this article will explain all. I'll try to get back to writing related things next time. A good way to understand things is by example. So, here goes...

Suppose you have three stories you're working on, and that their word counts are as follows:

Story TitleCurrent Word CountExpected Final Count
My Favourite Horse16,23130,000
The Long Walk Home10,38825,000
Hide & Seek9,65415,000

The goal is to create a table containing the three word meters. Such as in the following example.

Works In Progress

To do this you'll need to follow the instructions given below.

  1. Sign into blogger and go to your blog page.
  2. Click "customise" near the top-right.
  3. Go to the "add and arrange page elements" tab (if you're not already there).
  4. Choose a position and click one of the "add a page element" items. A window should pop-up saying "choose a new page element"
  5. Go to the one that says "HTML/JavaScript" and click the "add to blog" button.
  6. Give your word meter a title and then paste the following text into the main box (after adapting the green parts with your own title and word values...

    <script type="text/javascript" src=""></script>
    <script type="text/javascript">
    CbMeterSetSize (200, 12, 0, 0)
    CbMeterStart ("Title", "Count", "Expected", "Progress")
    CbMeterRow ("My Favourite Horse", 16231, 30000)
    CbMeterRow ("The Long Walk Home", 10388, 25000)
    CbMeterRow ("Hide &amp; Seek", 9654, 15000)

    CbMeterEnd () -->

  7. Click the "save changes" button.
  8. Click the "save" button near the top-right.
  9. Click "view blog".

Hopefully that should work. To update the meters, just edit the page element and change the numbers in the script.

API Manual

Non-techies can skip this part but it may be of interest to anyone who wants to 'tweak' their meters.

The following meter related functions are available from cb.js...

CbMeterSetSize (iWidth, iHeight, iStep, b3D)

Sets the dimensions and style of the meters. Dimensions iWidth and iHeight are in pixels. Use the value zero for defaults, so for example MeterSetSize (0, 20) would leave the width as default but set the height to 20 pixels. Set b3D to 1 for three-dimensional look (pretty but slow rendering), or zero for flat look. iStep is the number of pixels per 'block' in the 3D look.

CbMeterStart (psTitles, psCount, psMax, psMeter)

Start a new meter table and set the headings.

CbMeterRow (psTitle, iCount, iMax)

Produce a meter bar with a percentage value. psTitle is the story title. iCount is the current value and iMax is the maximum expected value (for 100%).

CbMeterEnd ()

End a meter table.


Lane said...

Flip that looks techie but thank you



Enjoy your day!

Anonymous said...

Thanks Lane :o)

Oh bugger, the example (in the "works in progress" grey box) doesn't seem to be working. Hang on, I'll try and fix it...

Annieye said...

Happy birthday to you
Happy birthday to you
Happy birthday dear Captain
Happy birthday to you.

Now I can make my word meter look like yours instead of having two!

Anonymous said...

Thanks's ladies. Can't beleeve I'm online at this time in the mornin'.

Ahh gaahd mt typing sucks. Wanna be a secretary. Yer fired!

Debs said...

I love your word meters and am going to try and instal them in my blog. Thanks.

Anonymous said...

Hi Debs, I see from your blog that you've finished three novels! Well done. That shed is obviously a productive environment.

I can see why you want to change word meters. One of your (Zokutou?) meters says 60,000/60,000 (100%) but the bar reads somewhat less.

Good luck installing my meters. Let me know if you need any further help.

Moondreamer said...

This is excellent, thank you! (I will definitely use it when I actually write something long enough to have a word meter!)

Please can you hurry up with the 'timetable' post you promised Gonna Be? I so need to read that!

Hope you had a fab birthday!