Documentation

1. Description

The Simple menu is an adjustable one-level menu which you can use in your sites. You can customize the appearance of the menu via several parameters (for example, you can easily switch the control to the vertical or horizontal layout). All the Items are clickable and hovered. This allows you to build a convenient and good looking navigation for your site.

The picture below shows an example of one-level horizontal and vertical menus:

Please refer to the XSL section for more information about XSL renderings.

2. Installation Guide

The Simple XSL menu rendering is distributed as a standard Sitecore package; hence in order to start using it, you should install the package. Please refer to the ' Installing Modules and Packages ' article if you are not familiar with the standard Sitecore Packager tool.

After the package installation, you will see the XSL menu control in the list of XSL renderings.

Thus you will be able to place it on a (sub)layout or tie via placeholder like any usual rendering.

In order to use this control, you should add the reference to the JavaScrpt file named menutools.js to your layout (this file contains the setCSSClass function, which is used in the menu rendering). The file is located here:

sitecore modules/OpenSource/scripts/menutools.js.

Thus the link should look like this:

3. User Manual

The Simple menu is an XSL rendering, and you can work with it like with any other XSL rendering.

The Simple Menu XSL rendering is controlled by several parameters.

Open the Parameters tab of the rendering to set rendering properties (double-click on the rendering) and set properties as described in the example below.

You can also define the properties in the xslSimpleMenu rendering (see  section in the rendering’s source code).

4. Valid Properties

Valid rendering properties

4.1. menu_type

Value:

enumeration {horizontal, vertical}

Parameter value:

Defines the type of the menu (e.g. if horizontal is set – horizontal menu will be rendered).

Note:

Horizontal menu will be rendered by default.

4.2. divider_class

Parameter value:

The CSS class for the divider

Note:

Default is empty (no divider)

4.3. dividerimage_class

Parameter value:

The CSS class for the divider image

4.4. dividerimage_path

Parameter value:

The Url path to the divider image

4.5. menuClick_class

Parameter value:

The CSS class for a clicked menu Item

4.6. menuBorder_class

Parameter value:

The CSS class for the menu border

4.7. menuHover_class

Parameter value:

The CSS class for a hovered menu Item

4.8. mainMenu_class

Parameter value:

The CSS class for the menu

4.9. source_node

Parameter value:

The path to the source Item for the menu

Note:

The default path is /sitecore/content/Home, it means that the menu will contain Items, which are children of level 1 for the Home Item. You can change this path according to your purpose

4.10. template

Parameter value:

The list of templates separated by exclamation marks. The menu will consist of Items based on one of the templates form this list

Note:

If this parameter is not specified, all the Items will be included in the menu by default. Every template should be separated by exclamation marks which precede and follow the template (for example,

!mainmenuitemtemplate!)

4.11. fieldTitle

Parameter value:

A field to display.

Note:

The field with the name ‘Title’ will be displayed by default. If the field with this name is not found, the Item's name will be shown.