Set up the DHTML user guide template

Publish

Platform_KC
On Premises

All the files you need are included in the Data\Templates\DHTML Search\ folder. Install these files in a central location if you are using a multi-user edition of Author-it.

To create the DHTML user guide template:

  1. Create a new book object template called DHTML User Guide Template.
    • Base the new book template on the User Guide template, and select the Make this object an object template box on the General tab.
    • Click Apply to create the new template, then change the template the book is based on to (none). This allows you to set the book properties but still change them after the fact, as the properties aren't inerited when the book is based on (none).
  2. From the HTML tab under Associated Files, set the frameset template to use the html_frameset.htm file from the DHTML Search folder. This frameset has 3 frames:
    • TAB frame - appears in the top left and displays the tabs. By default it displays tab_toc.htm. This HTML page contains several graphics with links to display the indexpage.htm and the search window.
    • TOC frame - appears in the bottom left and displays the Contents, Index and Search pages. By default toc.htm is displayed. Author-it always names the first TOC page toc.htm.
    • BODY frame - appears on the right and displays the main document. As the filename of the first page in a document is unknown, the default in the frame is a placeholder called main.htm. When publishing Author-it will rename this to the first HTML page in the document, whatever that may be.
  3. In the HTML Additional Files property of the book object, specify all the support files required. In this case:
    • tab_toc.htm - displays the contents tab as active in the TAB frame.
    • tab_index.htm - displays the index tab as active in the TAB frame.
    • tab_search.htm - displays the search tab as active in the TAB frame.
    • dhtml_search.htm
    • dhtml_search.js
    • contents1.gif, contents2.gif, contents3.gif - the 3 different states of the contents button.
    • index1.gif, index2.gif, index3.gif - the 3 different states of the index button.
    • search1.gif, search2.gif, search3.gif - the 3 different states of the search button.
    • tail.gif - an 'invisible' image that completes the TAB frame
  4. In the table of contents object used by the book, set the TOC Plain HTML Contents Display property in the Web tab to use the frameset defined in the book object.
  5. In the media object used by the table of contents object, set the HTML Template property in the Web tab to use the toc_template.htm custom page template.

    In this page, some JavaScript executes in the onLoad event that loads the tab_toc.htm file in the TAB frame. This keeps the tab appearance synchronized with the Contents no matter where the Contents is called from.

  6. In the media object used by the index object, set the HTML Template property in the Web tab to use the index_template.htm custom page template.

    In this page some JavaScript executes in the onLoad event that loads the tab_index.htm file in the TAB frame. This keeps the tab appearance synchronized with the Index no matter where the Index is called from.