Posted in: Comments

Lately I’ve seen different ways of creating a menu with correct and semantic html in EPiServer. The example in the EPiServer SDK is just soooo wrong from most perspectives. I think this is the best and simplest way:

<EPiServer:PageTree AutoBind="true" EvaluateHasChildren="True" PageLink="<%# MyTopMenu.OpenTopPage %>" ShowRootPage="false" runat="server">


		<%# Container.HasChildren ? " class=\"has-children\"" : "" %>>
			<a href="<%# Container.CurrentPage.LinkURL %>"><EPiServer:Property PropertyName="PageName" runat="server" /></a>

		<%# Container.HasChildren ? " class=\"has-children\"" : "" %>>
			<strong><EPiServer:Property PropertyName="PageName" runat="server" /></strong>



Notice how we don’t close the listitem in ItemHeaderTemplate. If you don’t want to evaluate if the page has children you can close it in the header template.