Top Previous Next

Create menu structure.

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


Switch to Item Tab

Create top item.

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

1. Select it.
2. Set focus on Text edit field and clear it.
3. Select Top style in the Style combo box.

Create bottom item.

1. Press Add New Item button AddButton at the top of Menu Tree window.
2. Apply Bottom style.

Create Products item.

1. Select top item in the menu tree.
2. Press Add New Item button AddButton at the top of Menu Tree window.
3. Set Text as Products.
4. Apply Level-1-arrow style.

Create ?Download item.

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

Create Support item.

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

Create Company item.

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

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 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 Support Center item.

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

Create Online Documentation item.

1. Press Add New Item button.
2. Set Text as Online Documentation.

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.

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

1. Switch to All Styles Tab.
2. Select AcrdMenu1 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 5.