This topic applies to Web Forms.
A top-level navigational menu enables the user to navigate around the website easily.
Create a main menu with `
EPiServer:MenuList` as follows:
In edit view, add some pages under the website’s start page, such as: News, Documents, Examples and Events. When the menu is complete, you can navigate to and from these pages.
In _web.config_, set the variable `
pageStartId` to the website’s start page ID. In the menu list, display each page’s name as a link to that page; use the built-in `
PageLink` property of the current page.
Add a new Optimizely Content Management System (CMS) web control to the project; `
MainMenu` in this example.
In the _MainMenu.ascx_ user control file, add the control with closing tags and give the control the ID value **Menu**.
PageLink` attribute is set in the control’s code-behind file. Set the PageLink attribute and the control ID, and see the code example in this topic.
Add an item template **\<ItemTemplate>** around the CMS `
PageLink` property. These recur for every page item that exists in the list. A page link is displayed for all the pages in the page hierarchy under the start page.
Pass in the correct CSS class to get the right look and feel (`
CssClass="NormalLink"`), by setting the `
CssClass` attribute on the `
PageLink` attribute of the `
EPiServer:MenuList` control should be made dynamic instead of using a hardcoded ID to the start page of the website. A reference to the start page of the website is automatically available through the static `
StartPage` property in the [EPiServer.Core.PageReference](🔗) class. This provides a context to the menu control, indicating which pages it will display. In the code-behind file set the control attribute `
Menu.PageLink` to the `
PageReference.StartPage` property. See the code example in this topic.
Use data binding to access the property and use the retrieved information as part of the loading of a control. (Data binding is a .NET concept and is documented in the Microsoft .NET help files.) You must explicitly data vind the menu list control by calling its `
DataBind()` method, by placing the example code (in this topic) in the `
Page\_Load` event in the code-behind file (where menu is the **ID** of your `
MenuList` web control). The menu should be functional now.
Browse to the website’s start page and verify that the top menu accurately displays the names of the pages in the top-level of the website structure. Click the links in the menu to verify that the navigation is working.
**MenuList code example markup**
**MenuList code example code behind**