برای ایجاد این رابط، کدهای زیر را در ستون سمت چپ صفحه Site.master به جای متن TODO: Menu will go here … قرار دهید:
<ul>
<li>
<asp:HyperLink runat="server" ID="lnkHome" NavigateUrl="~/Default.aspx">Home</asp:HyperLink>
</li>
<asp:Repeater runat="server" ID="menu" DataSourceID="SiteMapDataSource1">
<ItemTemplate>
<li>
<asp:HyperLink ID="lnkMenuItem" runat="server" NavigateUrl='<%# Eval("Url") %>'><%# Eval("Title") %></asp:HyperLink>
<asp:Repeater ID="submenu" runat="server" DataSource="<%# ((SiteMapNode) Container.DataItem).ChildNodes %>">
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li>
<asp:HyperLink ID="lnkMenuItem" runat="server" NavigateUrl='<%# Eval("Url") %>'><%# Eval("Title") %></asp:HyperLink>
</li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" />
کدهای بالا، یک کنترل Repeater به نام menu را به یک SiteMapDataSource؛ که سلسله مراتب تعیین شده نقشه سایت در Web.sitemap را برمیگرداند؛ متصل میکنند. اگر ویژگی ShowStartingNode در SiteMapDataSource برابر False قرار داده شده باشد، فرزندان گره Home را برمیگرداند. Repeater هر کدام از این گرهها را درون یک عنصر <li> نمایش میدهد. Repeater درونی، فرزندان گره جاری را درون یک لیست بدون ترتیب درونی نمایش میدهد.
نتیجه کدهای بالا باید مطابق شکل زیر باشد: