Create a Sitemap Page with Umbraco 7

By Stephen Garside on 4/6/2016

In this article I am going to explain how to create a simple site map (or Sitemap) page using Umbraco 7 and an MVC Razor view.

Before you create the Sitemap page in Umbraco you will need to add a new property to your Master document type.  This property should be called hideInSitemap and be of type checkbox. In my implementation I have added the property to my Master document type and then ticked it on all the content pages I want to include on my site map:- 

 umbraco hide in sitemap property

 

Next, you will need to create a document type and template for your sitemap page and add it as content underneath your home page:-

site map page in umbraco7

With your Umbraco site map page in place you are ready to amend your template.  The example below uses an MVC Razor Helper function to iterate through initially all the child nodes of the current page, and then through the child nodes of each of these nodes - and so on until it reaches the bottom of your menu structure. Only nodes that are both Visible and have the HideInSiteMap property set to true will be rendered.

 

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage

@using System.Linq;

 

@{

    Layout = "Master.cshtml";

}

 

<div class="container">

    <h1>@Umbraco.Field("pageTitle")</h1>

    @ListNodes(Umbraco.TypedContent(UmbracoContext.Current.PageId).AncestorOrSelf(1))

</div>

 

@helper ListNodes(IPublishedContent startNode)

{

    string ulClass = startNode.Level == 1 ? "ul-top" : "ul-sub";   

    string liClass = startNode.Level == 1 ? "li-top" : "li-sub";

   

    <ul class="@ulClass">

        @foreach (var node in startNode.Children.Where("Visible && !hideInSitemap"))

        {

            <li class="@liClass">

                <a href="@node.Url" title="@node.Name" class="link">@node.Name</a>

                @if (node.Children.Where("Visible && !hideInSitemap").Count() > 0)                   

                {

                    @ListNodes(node)

                }

            </li>

        }

    </ul>

}

 

For ease of styling, the code also adds a class to each list and list item - you can see a basic working example at www.stephengarside.co.uk/sitemap/

 

The last step is to make sure you add your new Umbraco 7 MVC sitemap url to your robots.txt file as so:-

Sitemap: http://www.stephengarside.co.uk/sitemap/

 

This will ensure search engine bots quickly find your sitemap page and index your content appropriately. 

Easy Peasy!

Share this article...
Join the Discussion...