Saturday, March 21, 2009

Auto Numbering Headers in Google Docs

Google Docs allows generation of table of contents, but doesn't by default number the headers. This inability can be overcome via some CSS magic.

Simply put these into the CSS file, opened from Edit menu's Edit CSS item. This will autonumber header 2,3 and 4. (H2, H3, H4)


body {
counter-reset: chapter;
}

h2 {
counter-reset: section;
counter-increment: chapter;
}
h3 {
counter-increment: section;
counter-reset: part;
}
h4 {
font-weight: bold;
counter-increment: part;
}
H2:before {
content: counter(chapter) "." " ";
}
H3:before {
content: counter(chapter) "." counter(section) " ";
}
H4:before {
content: counter(chapter) "." counter(section) "." counter(part) " ";
}

3 comments:

Unknown said...

Nice! Is there a way to do this for level 1 headers too? I don't know CSS From looking at it, it seems I would need to know the name of the next level up heading from chapter, which seems to be associated with h2.

Thanks
Michael

ustunozgur said...

The higher level would be h1 actually, so you can add just like other header levels.

Unknown said...

Thanks. I have never seen CSS before, so it will take me anywhere from 10 min to two hours to figure it out and test it. I looked at other examples on the web, and some work for h1 and h2 but not h3. etc.

No time like the present to learn a bit of CSS, I guess!

Michael