User's Guide: Tutorial

At the moment our site consists of two pages - Home and Movies. It is a good time to get back to the template and complete the menu.

Open the template page and remove the Site menu will go here text. Leave the cursor at the top line and click the New button in the DHTML Menu Extension floater window.

If the floater is not visible, choose Window > DHTML Menu Extension to toggle it.

Refer to the Inserting a new menu section if you need more details about possible ways of inserting a menu.

The DHTML Menu Extension will open. There you can create a structure of the menu, choose the graphical appearance etc. To learn more about building the menu, see Building the menu section.

For our sample site we will create a menu consisting of two main items and one pop-up item.

Click the empty placeholder in DHTML Menu Extension's Menu Structure editor and type Home. In the Menu Properties grid on the right, move to the Destination URL field and type index.htm - this is a relative URL pointing to our home page from the site main folder which is c:\mysamplesite\.

Important note
When you define a Destination URL for a menu item, make sure it points to the destination page in the right way. The simplest way to do this it to type a relative URL pointing to the page from the root/main site folder. For the items above we specified index.htm for Home page because the file resides in the root folder and hobby/movies.htm for Movies page because the movies.htm file is in the hobby subfolder.

Now click on the placeholder next to the Home item in the structure editor type Hobby and press Enter. Then move to the placeholder under the Hobby item (press down arrow key on the keyboard), type Movies and then hobby/movies.htm in the Destination URL field in the properties on the right. This menu item will point to the previously created Movies page.

We will leave the default menu appearance options.

Click the Done button, and provide a file name to save the menu project when prompted. It can be c:\sample.dms for example.

After a while DHTML Menu Extension will generate the menu and it will appear on the template page. Don't be surprised if the menu doesn't look like it should. Since Dreamweaver editor doesn't process JavaScript code, the menu may look in some cases a little bit strange but the final look will be just like it should be.

When you save the template file, you will be asked whether to apply changed to the pages using the template. When you choose to do so the menu will appear on Home and Movies page.