Main menu

Top  Previous  Next

Now we will add a dynamic drop-down menu to our master page. The drop-down menu can be implemented either by CMSMenu or CMSListMenu control. The first option is easier to use if you're not familiar with complex CSS styles, so we will use it now.

 

Please note: If you prefer using a drop-down menu based on the CSS styles and UL/LI elements, you can try to use the CMSListMenu later (you can find more details and examples in Kentico CMS Controls Reference).

 

Swith to the Source mode of the MyMaster.master page and drag and drop the CMSMenu control inside the <div class="MainMenu"> element. Remove the original <table> element used for the static menu. The main menu section will look like this:

 

<!-- main menu -->

<div class="MainMenu">

   <cc1:CMSMenu ID="CMSMenu1" runat="server" />

</div>

 

Now switch back to the Design tab and set the following properties of the CMSMenu control:

 

Path: /%
Layout: Horizontal
CSSPrefix: ;sub
Cursor: Pointer

 

The Path property value specifies that the menu should start from the root of the site structure.

The Layout property allows you to choose between vertical and horizontal menu.

The CSSPrefix property specifies the names of CSS styles for the top menu (standard style names) and for sub-menus (all style names are prefixed with sub).

The Cursor property specifies the type of cursor when the user mouse-overs the menu.

 

Save the changes.

 

 

 

Kentico CMS Controls and Web Parts

 

While Kentico CMS is delivered with a set of flexible server controls in the CMS.Controls.dll library, lots of functionality is only available in the web parts that are stored in the CMSWebParts folders. These web parts are standard ASCX user controls and they can be used on both portal engine templates and on ASPX pages. You only need to drag and drop the web parts on your ASPX page and set their properties in the Properties window of Visual Studio. All CMS controls have a relevant web part as well.