Home > Creating your first menu > Change the menu items content

Change the menu items content

What we'll do in this section is take the menu we created in the preceeding section, Your first static menu, and add a few menu items - a submenu which will contain two buttons, a caption and a separator. Following, we'll configure the data content of these menu items such that we obtain the effect which we want.

In order to fully be able to use the information in this section, you should first go through the Your first static menu section, as we'll pick up the work from the end of that section.

Note: This procedure doesn't apply to the Developer Edition of FlexiMenus JS, as in this case the menu structure and the content of the menu items are loaded from the recordset.

  1. Open the .html file you created in the Your first static menu section.
  2. Switch to the Configuration section, where we will configure the menu structure. In the Menu Structure panel, select the last button, Contact, and add a submenu. Following, select the Contact submenu, and add the following menu items, in this order: a caption, a separator and two buttons. In the following steps we'll configure the data content of the buttons and caption.
  3. In the Menu Structure panel, select the Contact submenu, and switch to the Button tab. In the configuration section, set Text for the Data Content option. Following, select the Caption tab; set Text&Icon for the Data Content option.
  4. In the Menu Structure panel, select the caption you created in Step 2. As this caption is of text&icon type, you will need to put an image in the Dreamweaver site; download the image from here and copy it in the Dreamweaver site. Switch to the Data tab and insert the location to the image in the Icon URL option and Support Information in the Text option.
  5. Switch to the Menu Structure panel. Select each of the two buttons and in the Data tab, insert the following values to the Text option: Support, repsectively Forum.
  6. Click the Save button at the bottom of the interface to save the changes and add the menu to the page. In the File menu, click Preview in Browser and select a browser from the list or click F12 to preview the page in your default browser.