Complex page menu lists

Topics: Business Logic Layer, Controls, Themes
Sep 1, 2011 at 4:53 PM

I have a custom theme for a site that I am working on that has a 3-level deep hierarchical structure. My first problem is that I need to be able to split the menu lists up into three different lists located at different locations on the site. My second problem is that the second and third menu lists are built dynamically based on what page is being requested. My third problem is that depending on what page you're requesting I need to be able to modify each menu to have custom classes. See the diagram below:

<ul class="menu" id="level1">
<li class="menu-item current-page-ancestor" id="services"><a href="<%=Utils.AbsoluteWebRoot %>page/Services.aspx">Services</a></li>
<li class="menu-item" id="applications"><a href="<%=Utils.AbsoluteWebRoot %>page/Applications.aspx">Applications</a></li>
<li class="menu-item" id="about_us"><a href="<%=Utils.AbsoluteWebRoot %>page/About-Us.aspx">About Us</a></li>
<ul class="menu" id="level2">
<li class="menu-item" id="loans"><a href="<%=Utils.AbsoluteWebRoot %>page/Loans.aspx">Loans</a></li>
<li class="menu-item current-page-ancestor" id="checking"><a href="<%=Utils.AbsoluteWebRoot %>page/Checking.aspx">Checking</a></li>
<li class="menu-item" id="savings"><a href="<%=Utils.AbsoluteWebRoot %>page/Savings.aspx">Savings</a></li>
<ul class="menu" id="level3">
<li class="menu-item" id="new_checking_account"><a href="<%=Utils.AbsoluteWebRoot %>page/New-Checking-Account.aspx">New Checking Account</a></li>
<li class="menu-item" id="checking_types"><a href="<%=Utils.AbsoluteWebRoot %>page/Checking-Types.aspx">Checking Types</a></li>
<li class="menu-item current-page" id="rates"><a href="<%=Utils.AbsoluteWebRoot %>page/Rates.aspx">Rates</a></li>

In this example you are on the Rates page which is a child of the Checking page which is in turn a child of the Services page. The Services menu item in the first list and the Checking menu item in the second list have an additional custom class of "current-page-ancestor". The Rates menu item in the third list has an additional custom class of "current-page".

I need help in determining how and where to put the code to build these lists so that I can place a single line of code in the site.master file for each list that can utilize the runat="server" attribute. I would like to avoid hard-coding these lists directly into the site.master file. Any help is greatly appreciated!

Sep 1, 2011 at 6:06 PM

Take a look at app_code/controls/PageMenu.cs - you probably can use some of that code, building in logic you need. Result will be regular custom control you can register on any page including master.

Sep 1, 2011 at 7:18 PM

Thanks! This looks like a good place to start.

Is PageMenu.cs considered a part of the core for BlogEngine? Currently I'm on version 2.0, would I lose my changes to this file if I were to upgrade to version 2.5?

Next if this control is already a part of BlogEngine, how and where do I implement it within my theme?

Sep 2, 2011 at 2:29 PM

Yes, it is part of the core. To use, anywhere in your theme add declaration to core (if not there already) and add menu tag to the markup.

<%@ Import Namespace="BlogEngine.Core" %>
<blog:PageMenu ID="PageMenu1" runat="Server" />