Using a Customized HTML Frameset

When your Book is published to HTML, Author-it uses the frameset template defined under the HTML settings of the Book Object to build an integrated website with intuitive navigation.

With a little knowledge of HTML, you can quickly customize this frameset to meet your specific requirements. For example, you may wish to add a banner-like frame containing your company name and/or logo to the top of the frameset - in much the same way that our current documentation uses a separate frame containing the Book name.

Tip

Tip: You can use a variable in the banner file to pull the title from the Book name.

To Customize the HTML Frameset

Start by creating a new folder that contains the necessary files - call it something like 'Website' for easy identification. In this example, we'll copy all the files from the ..\Templates\CGI FTS folder to begin with, as this folder contains the default files we use for HTML output with a full text search. You can then adapt/customize (or replace) these files to suit.
The frameset included in this folder (html_frameset.htm) has 3 frames as follows:
- 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.
Adapt this frameset by adding another frame along the top (with your company banner), so it looks something like:
Specify the file (and correct path) to the new html_frameset.htm in the HTML Frameset property on the HTML tab of the Book object.
Under the HTML Additional Files property of the Book object, specify the supporting files required. In this case:
- tab_toc.htm - this file displays the Contents tab as active in the TAB frame.
- tab_index.htm - this file displays the Index tab as active in the TAB frame.
- tab_search.htm - this file displays the Search tab as active in the TAB frame.
- contents1.gif, contents2.gif, contents3.gif - the 3 different states of the Contents button. You can replace these with custom graphics.
- index1.gif, index2.gif, index3.gif - the 3 different states of the Index button. Again, you can replace these with custom graphics.
- search1.gif, search2.gif, search3.gif - the 3 different states of the Search button. Again, you can replace these with custom graphics.
- tail.gif - an 'invisible' image that completes the TAB frame.
- and most importantly, the new banner.htm file called by the frameset.
  Note: Make sure to select the files from your new folder.
Open the Table of Contents object and set the Plain HTML Contents Display property in the HTML tab to use the custom frameset defined in the Book object.
Open the Media object used by the TOC object (usually 'Contents Section') and set the TOC to use the toc_template.htm custom page from the new folder.

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.
Open the Media object used by the Index object (usually 'Index Section') and set the Index to use the index_template.htm custom page from the new folder.

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.

For details on attaching the CGI script used by Author-it, refer to Adding a Full Text Search Engine to your HTML. This script can be customized to suit if necessary, or you can add your own search engine.