How to Setup the DHTML User Guide Template

All the files you need are included in the Data\Templates\DHTML Search\ folder. These files should be installed on 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, ensuring the Make this object an object template box on the General tab is checked.
   • Choose Apply to create the new template, then change the template the Book is based on to (none). This is a quick way of setting the Book properties yet still being able to change them, as the properties are no longer inherited.
2. Switch to the HTML tab and under the 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 HTML tab to use the frameset defined in the Book object.
5. In the Media object used by the Table of Contents object (usually Contents Section) set the HTML Template property in the HTML 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 (usually Index Section) set the HTML Template property in the HTML 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.