---
title: Create a main menu with EPiServer:MenuList
slug: cms-11/dev-docs/creating-a-main-menu
docTags: 
createdAt: 2026-07-22T19:45:18.655Z
---

:::hint{type="warning"}
**Important**
This topic applies to Web Forms.
:::

A top-level navigational menu enables the user to navigate around the website.

Create a main menu with `EPiServer:MenuList` as follows:

1. Add some pages under the website's start page in edit view, such as News, Documents, Examples, and Events. You can go to and from these pages when the menu is complete.
2. 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.
3. Add an Optimizely Content Management System (CMS) web control to the project; `MainMenu` in this example.
4. In the `MainMenu.ascx` user control file, add the control with closing tags and give the control the ID value **Menu**.
5. The `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.
6. Add an item template `<ItemTemplate>` around the CMS `PageLink` property. These recur for every page item that exists in the list. The start page in the page hierarchy displays a page link for the pages.
7. Pass in the correct CSS class to get the right look and feel (`CssClass="NormalLink"`), by setting the `CssClass` attribute on the `Property` control.
8. The `PageLink` attribute of the `EPiServer:MenuList` control should be made dynamic instead of using a hardcoded ID to the website's start page. A reference to the start page of the website is automatically available through the static `StartPage` property in the [EPiServer.Core.PageReference](/epiui/CMS/Content/documentation/Class-library,,66786/?epieditmode=False\&documentId=cms/10/29B0D74A) class, which provides context to the menu control, indicating the 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.
9. 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 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.
10. Browse to the website's start page and verify that the top menu accurately displays the names of the pages at the top level of the website structure. Click the links in the menu to verify that the navigation is working.

**MenuList code example markup**

```xml
<EPiServer:MenuList runat="server" id="Menu">
  <HeaderTemplate>
      <ul id="MainMenu">
  </HeaderTemplate>
  <ItemTemplate>
    <li class="unselected"><EPiServer:Property PropertyName="PageLink" runat="server" /></li>
  </ItemTemplate>
  <SelectedTemplate>
    <li class="selected"><EPiServer:Property runat="server" PropertyName="PageLink" /></li>
  </SelectedTemplate>
  <FooterTemplate>
    </ul>
  </FooterTemplate>
</EPiServer:MenuList>
```

**MenuList code example code behind**

```csharp
public partial class MainMenu: UserControlBase {
  protected override void OnLoad(System.EventArgs e) {
    base.OnLoad(e);
    Menu.PageLink = PageReference.StartPage;
    Menu.DataBind();
  }

  /// <summary>
  /// Gets or sets the MenuList for this control
  /// </summary>
  public MenuList MenuList {
    get {
      return Menu;
    }
    set {
      Menu = value;
    }
  }
}
```