Implementing the Menus

DHTML Menu Builder offers several tools to help you add the code it creates to your web pages.
The way you configure your project will determine the tool you use. Of course, you can always add the code to the pages manually. Understanding the manual process will allow you to understand how the automated tools work, what they do, and how you can detect and overcome possible conflicts and problems.

The most common project setups are described below. Read each one to determine which tools you should use:

  • Without Frames
    If your project does not use frames, select the method below based on whether or not you are using a toolbar created by DHTML Menu Builder:
    • Using the toolbar created by DHTML Menu Builder
      If you're going to use the toolbar created by DHTML Menu Builder, all you need to do is place the code on the pages that will contain the menus. This is done using the Install Loader Code tool. (The loader code is the code that points to the JavaScript files created by DHTML Menu Builder.)
      To access this tool, click the Tools menu and then click Install Loader Code.
      The Install Loader Code dialog will allow you select which files from your root web should display the toolbar. You can select files one by one or add a whole directory at once.
      Click the Install button to start the process of placing the code on the pages.
    • Using a toolbar you have created
      When you're the one providing the toolbar, you will need to follow a different procedure:
      • Attach the trigger code: The trigger code is the code that is placed on your hotspots, and enabling them to respond to mouse actions and display the menus.
        The trigger code is attached using the HotSpots Editor. Since the HotSpots Editor automatically adds the loader code, using the Install Loader Code tool is not necessary with your own toolbar if you use the HotSpots Editor.
  • With frames
    If your project uses frames, there's an extra step that needs to be taken in order to add the menus to your web site.
    All the documents that are to be displayed in the same frame as the menus (not the hotspots) need to load a special file.
    To install the loader code for this special file, use the Install Frames Loader Code option found on the Tools menu.
    In the dialog, select all the documents on your web that will be displayed in the same frame as the menus. Click the Install button to copy the loader code to the pages.
    More information on the frames support offered by DHTML Menu Builder

Manually adding the menus

As you have seen above, there are several pieces of code that need to be present on your pages so the menus can be used.
All the code that needs to be placed on your pages can be copied from a file that DHTML Menu Builder generates every time you compile your project. This file is located in the same directory as where the compiled JavaScript files are placed. The files is called hRef.txt. You can open this file using Notepad or any other text editor.

  • The loader code
    The loader code is the code that points to the JavaScript files created by DHTML Menu Builder. This code is always placed after the opening <body> tag of your HTML document.
    To add this code to your web page(s), simply copy it from the hRef.txt file and paste it into your document(s).
  • The trigger code
    This is the code that makes your hotspots active elements so they can react to the mouse actions and display the menus.
    This code is always placed in the anchor tag <a> of your hotspots.
    To add this code to your web page(s), simply copy it from the hRef.txt file and paste it into your document(s).
Related topics of interest: