Make WebHelp TOC Wrap

Entries in the TOC normally don’t wrap when the TOC becomes to small. To get the TOC entries to wrap, you need to modify the output file whthost.js.

Note:

• Line numbers are for RoboHelp 8/9/10/11.

Making the text wrap

1. Open whthost.js and go to line 665. Remove width=”+nWidth+”so the line looks like this:

document.write("<table border=0><tr><td>");

2. Search and replace all occurrences of <nobr>with <span>.
3. Search and replace all occurrences of </nobr>with </span>.
4. Go to line 687 and replace NOBR with SPAN:

var tempNobr=getChildrenByTag(tempColl[i],"SPAN");

5. Go to line 431 and add .replace(/&nbsp;/g, ” “)to the line:

var sName=_textToHtml(getItemName(nIdx)).replace(/ /g, " ");

6. Now replace the line 432:

var sHTML="<p><nobr><a id=\""+getItemId(nIdx)+"\" onfocus =\"markItem("+nIdx+");\" onclick=\"markItem("+nIdx+");\""

with:

var sHTML="<p><span";
if(!sName.match(" "))
  sHTML+=" style=\"white-space: nowrap;\"";

sHTML+= "><a id=\""+getItemId(nIdx)+"\" onfocus =\"markItem("+nIdx+");\" onclick=\"markItem("+nIdx+");\""

7. Go to line 259 and add .replace(/&nbsp;/g, ” “)to the line:

var sName=_textToHtml(getItemName(nIdx)).replace(/ /g, " ");

8. Now replace the line 275:

sHTML+="parent><p><nobr><a id=\""+getBookId(nIdx)+"\" href=\""+sBookRef+"\" onfocus=\"markBook("+nIdx+");\" onclick=\"";

with:

sHTML+="parent><p><span";
if(!sName.match(" "))
  sHTML+= " style=\"white-space: nowrap;\"";

sHTML+="><a id=\""+getBookId(nIdx)+"\" href=\""+sBookRef+"\" onfocus=\"markBook("+nIdx+");\" onclick=\"";

Making the TOC wrap around the images

The TOC now wraps directly under the images in the TOC. To avoid this, You need to indent the TOC entry and use a negative text indent to compensate the first line. First you need to know the dimensions of the images you are using. Then you need to add 4 pixels to the width of the image.

Say that the book image is 12 pixels width. You will need to indent the text 16 pixels. In the example, below, the width of the image is 12 pixels.

1. Go to line 275 and replace the line

sHTML+="parent><p><span";

with

sHTML+="parent><p style=\"margin-left: 16px; text-indent: -16px;\"><span";

2. Go to line 436 and replace the line

var sHTML="<p><span";

with

var sHTML="<p style=\"margin-left: 16px; text-indent: -16px\"><span";