Setting up HTML5 Navigation in FrameMaker output

Basic HTML5 output from FrameMaker is quite easy and looks surprisingly good. It’s when you want to move beyond the default choices and formatting that you will need to get creative.

Such is the case when setting up the navigation panel, or the TOC, in a number of the HTML5 layouts.

If your FrameMaker HTML5 output has one or more instances of the word ‘Manual’ then you need to modify your Table of Contents.

FrameMaker uses your generated TOC to produce the nav panel for HTML5 output. To do that, it processes the paragraphs collected and formatted by the TOC.

The problem occurs if you don’t have all levels of your TOC being collected by the TOC itself.

Issue 1: Omitted paragraph tag

For instance, here’s what I got recently when I neglected to include my glossary title paragraph in my Fm TOC:

By including my glossary title in the TOC, I quickly got this:

Issue 2: Need for top level tag

What’s not as obvious is that you may need to include your book title in your TOC as well. This is because without a book title in the toc, you may have a topic (the title page) that generates a ‘Manual’ entry in the TOC.

I manage this by including the book title in the TOC, and giving it a ‘Table of Contents’ suffix with the paragraph tag. That way the PDF and the HTML5 both have workable navigation.

In the image above, the Table of Contents text is an autonumber suffix, applied via the paragraph tag.

Got a better solution?

Let me know if this works for you. I don’t find it ideal to put the book title in the TOC, and I’d rather not have everything nested in a top-level entry in my HTML5 nav, but for now that’s the way I’m handling it.

If you’ve found a better solution, I’m happy to update this post and give credit where credit is due!