Create a tree menu with categories

To ease navigation through the ads, you can place a menu on the home page, allowing visitors to browse the categories on your site. Though it can be done with simple tables and some conditional regions, the easiest (and best looking) way is to use another InterAKT extension: MX Tree Menu. This extension is not included in MX Kollection, but you can download it for free from the InterAKT web site.

Before you start creating the page described in this section of the tutorial, you must download and install the extension mentioned above.

What this extension does, as its name suggests, is to create a tree-like menu, from the category table. The field that determines which category is on which level, is the self foreign-key idcat_cat. If this field contains the value 0, then the category is a top-level one; otherwise, it will be placed under the category whose id it contains.

After you've installed this extension, a new tab called InterAKT will appear on the Insert panel. On it there are two buttons, allowing you to insert a tree menu based on database fields, or on manually entered values.

If you have installed the MX Tree Menu extension, and understood what the table structure is for the category_cat table, you can proceed and create the page:

1. First open the menu.php page in Dreamweaver.

2. Apply the Dynamic Tree Menu Command from the InterAKT tab of the Insert panel.

3. Configure the dialog box that opens as follows:
   · In the Connection drop-down menu select the database connection created at the beginning of the tutorial: connAds.
   · The table containing the items to be displayed is category_cat.
   · The Primary key is selected automatically, and in the Parent ID drop-down menu, select the table field storing the upper category: idcat_cat.
   · In the Menu entry name select the labels for the menu elements: name_cat.
   · Each element is in fact a link to a page that will display the ads in the respective category. Since the menu will have to be available all the time, the easiest way is to create the main page with MX Includes, allowing you to combine several pages. This way, you are using the same page, which receives the category ID as an URL parameter.
   · The dialog box options that sets this is the URL type. Select Built with URL parameter. In the following fields, enter the URL, complete with the URL parameter name, and in the drop-down menu, select the table field that will provide the values.
   · Leave the Target drop-down menu at its default value, because it is not necessary for this page.
   
   
    

4. Once you click on the OK button,  the menu will be added to the page, and a translator will be shown in Dreamweaver:
   
   
    

5. You can save the page and preview it in the browser by pressing the F12 key. The page will display a tree-like menu, with the categories that have the idcat_cat 0 (zero) as top-categories: