Step 5

Top Previous Next

Create menu structure.

Here we?ll add new item and set all its properties.

?

Switch to Item Tab

Create Products item.

We already have an item that was created automatically at Step1.

1. Select it.
2. Set focus on Text edit field and set Text as Products.
3. Select Level-1-arrow style in the Style combo box.

Create ?Download item.

1. Press Add New Item AddButton button.
2. Set Text as Download.
3. Apply Level-1 style.

Create Purchase item.

1. Press Add New Item button.
2. Set Text as Purchase.
3. Apply Purchase_btn style.

Create Company item.

1. Press Add New Item button.
2. Set Text as Company.
3. Apply Level-1-arrow style.

?

Now we can see our menu top level in the preview window

TutorialTopLevelPreview

Create Product #1 item.

1. Select Products item in the menu tree
2. Press Add New Item button
3. Press Move Item One Level Down LevelDownButton button
4. Set Text as Product #1
5. Apply Level-2-arrow style

Create Product #2 item.

1. Press Add New Item button
2. Set Text as Product #2
3. Apply Level-2 style

Create Product #3 item.

1. Press Add New Item button.
2. Set Text as Product #3

Create Windows item

1. Select Product #1 item.
2. Press Add New Item button.
3. Press Move Item One Level Down button.
4. Set Text as Windows.
5. Apply Level-3 style.

Create Mac item.

1. Press Add New Item button.
2. Set Text as Mac.

Create Linux item.

3. Press Add New Item button.
4. Set Text as Linux.

Create About Us item.

1. Select Company item.
2. Press Add New Item button.
3. Press Move Item One Level Down button.
4. Set Text as About Us.
5. Apply Level-2 style.

Create What's New item.

1. Press Add New Item button.
2. Set Text as What's new.

Create Contact Us item.

1. Press Add New Item button.
2. Set Text as Contact Us.

?

As we don't use auto created Default Style style we can remove it.

1. Switch to All Styles Tab.
2. Select Default Style style in the Style combo box.
3. Press Delete Style DelButton button.
4. Press Yes in the confirmation message box.

?

Accordion Menu structure is created.

You can see it in the Preview Window.

TutorialMenuPreview

?

How to save the menu and publish it see step 6.