Simple Umbraco Footer Navigation

From building other sites, something which has become quite popular / important are having a footer navigations. Whether it be for architecture, SEO or usability from my experience its something that clients/users want on the site, and the ability to choose which pages appear there.

Here’s a very simple little bit of XSLT which will let you do just that, all you need to do is add the following property to your DocType you want users to be able to put in the footer. [more]

For example I have CWS2 installed, and for the Textpage & Textpage (Two Col) DocType’s set with this property

footer-property

Now you have added the ‘ShowInFooter’ property to the DocTypes, we just need to create the XSLT file (With matching Macro) called ‘FooterNav’ and choose clean

macro

Simply delete all the XSLT and replace it with the XSLT in the below and save it

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp "&#x00A0;"> ]>
<xsl:stylesheet
  version="1.0"
  xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
  xmlns:msxml="urn:schemas-microsoft-com:xslt"
  xmlns:umbraco.library="urn:umbraco.library" xmlns:Exslt.ExsltCommon="urn:Exslt.ExsltCommon" xmlns:Exslt.ExsltDatesAndTimes="urn:Exslt.ExsltDatesAndTimes" xmlns:Exslt.ExsltMath="urn:Exslt.ExsltMath" xmlns:Exslt.ExsltRegularExpressions="urn:Exslt.ExsltRegularExpressions" xmlns:Exslt.ExsltStrings="urn:Exslt.ExsltStrings" xmlns:Exslt.ExsltSets="urn:Exslt.ExsltSets"
  exclude-result-prefixes="msxml umbraco.library Exslt.ExsltCommon Exslt.ExsltDatesAndTimes Exslt.ExsltMath Exslt.ExsltRegularExpressions Exslt.ExsltStrings Exslt.ExsltSets ">


<xsl:output method="xml" omit-xml-declaration="yes"/>

<xsl:param name="currentPage"/>

<xsl:template match="/">
<ul>
        <xsl:for-each select="$currentPage/ancestor-or-self::node/descendant-or-self::node/node [string(data[@alias='ShowInFooter']) = '1']">
                <li>                    
                    <a href="{umbraco.library:NiceUrl(@id)}">
                        <xsl:value-of select="@nodeName" />
                    </a>
                </li>
            </xsl:for-each>
</ul>
</xsl:template>

</xsl:stylesheet>

Add your footer macro in your HTML where you need the footer nav to appear

inline-code

All you need to do now is ‘tick’ the box if you want the page to appear in the footer, or leave it unchecked – That's it!

lastbit

Blogs I Read

Sites I Like

Simple Umbraco Footer Navigation