Elemento a DotNetNuke Skin by Adammer

Footer Menu

The footer of the Elemento skin is fairly tall to allow for a footer menu like the one on this site. When you do not use the PreFooterPane for a menu, its height will maintain a smooth gradiant to white.

To create the footer menu below, we added a Text/HTML module to the PreFooterPane and changed its settings to use the Elemento Banner skin and set the module to display on all pages.

Then we placed the following code in the Text/HTML module:

<ul>
    <li class="header"><a href="/Containers.aspx">Containers</a></li>
    <li><a href="/Containers/HeaderStyles.aspx">Header Styles</a></li>
    <li><a href="/Containers/TheDisappearingModuleTitle.aspx">Disappearing Module Title</a></li>
</ul>
<ul>
    <li class="header">Pane Layouts</li>
    <li><a href="/PaneLayout/Standard.aspx">Standard</a></li>
    <li><a href="/PaneLayout/SubPageRight.aspx">SubPage Right</a></li>
    <li><a href="/PaneLayout/SubPageRightNavigation.aspx">SubPage RightNav</a></li>
    <li class="additionalHeader">Pane Layouts w/ Breadcrumbs</li>
    <li><a href="/PaneLayout/StandardwBreadcrumb.aspx">Standard</a></li>
    <li><a href="/PaneLayout/SubPageRightwBreadcrumb.aspx">SubPage Right</a></li>
    <li><a href="/PaneLayout/SubPageRightNavigationwBreadcrumb.aspx">SubPage RightNav</a></li>
</ul>
...

The Pre Footer Pane is specifically designed for this functionality. Notice that the first list items use the "header" class.

 

Footer Menu