Skip to content
Shad Storhaug edited this page Feb 10, 2014 · 1 revision

Release Notes

Congratulations, you have just installed MvcSiteMapProvider!

The NuGet package has added the default configuration to your application. Unless you are using .NET 3.5 or have installed a DI modules-only package, this configuration will start up automatically.

However, you still need to add the HTML helpers to your views to see it work. Let's get started by adding the following 2 HTML helpers to your /Views/Shared/_Layout.cshtml or /Views/Shared/_Layout.aspx page.

@Html.MvcSiteMap().Menu()
@Html.MvcSiteMap().SiteMapPath()

If you run your project, you will now see a menu that looks something like this:

Home   About

And a breadcrumb trail that just shows:

Home

If you click the About link, you will see your breadcrumb trail change to the following (we are assuming you have a controller action on the HomeController named About and a corresponding view named /Views/Home/About.cshtml).

Home  >  About

Configuring Nodes

Next, let's add the Contact page to demonstrate how easy it is to add new pages to the configuration. Again, make sure your Home controller has a Contact action, like this:

    public ActionResult Contact(int id)
    {
        ViewBag.Message = "Your contact page.";

        return View();
    }

And make sure you have added a view named /Views/Home/Contact.cshtml (or .aspx).

Open up the /Mvc.sitemap file and you will see that the default configuration looks like this.

<?xml version="1.0" encoding="utf-8" ?>
<mvcSiteMap xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xmlns="http://mvcsitemap.codeplex.com/schemas/MvcSiteMap-File-4.0"
        xsi:schemaLocation="http://mvcsitemap.codeplex.com/schemas/MvcSiteMap-File-4.0 MvcSiteMapSchema.xsd">

    <mvcSiteMapNode title="Home" controller="Home" action="Index">
        <mvcSiteMapNode title="About" controller="Home" action="About"/>
    </mvcSiteMapNode>

</mvcSiteMap>

Add another node just below about, setting the title to "Contact Us", the controller to "Home", and the action to "Contact" as shown below.

<?xml version="1.0" encoding="utf-8" ?>
<mvcSiteMap xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xmlns="http://mvcsitemap.codeplex.com/schemas/MvcSiteMap-File-4.0"
        xsi:schemaLocation="http://mvcsitemap.codeplex.com/schemas/MvcSiteMap-File-4.0 MvcSiteMapSchema.xsd">

    <mvcSiteMapNode title="Home" controller="Home" action="Index">
        <mvcSiteMapNode title="About" controller="Home" action="About"/>
        <mvcSiteMapNode title="Contact Us" controller="Home" action="Contact"/>
    </mvcSiteMapNode>

</mvcSiteMap>

Run your project again, and you will see that your menu now contains a Contact Us link. Click it and you will see that the breadcrumb trail now shows the path below.

Home  >  Contact Us

Don't like XML configuration?

Changing the Templates

Don't like the HTML elements that are output from these HTML helpers? Change them!

Navigate to the /Views/Shared/DisplayTemplates/ folder and you will see a list of templates that are used to build the HTML, as follows.

  • CanonicalHelperModel
  • MenuHelperModel
  • MetaRobotsHelperModel
  • SiteMapHelperModel
  • SiteMapNodeModel
  • SiteMapNodeModelList
  • SiteMapPathHelperModel
  • SiteMapTitleHelperModel

To edit the menu, have a look at the MenuHelperModel.cshtml file. The default looks like this:

@model MvcSiteMapProvider.Web.Html.Models.MenuHelperModel
@using System.Web.Mvc.Html
@using MvcSiteMapProvider.Web.Html.Models

<ul id="menu">
    @foreach (var node in Model.Nodes) { 
        <li>@Html.DisplayFor(m => node) 
            @if (node.Children.Any()) {
                @Html.DisplayFor(m => node.Children)
            }
        </li>
    }
</ul>

It calls the SiteMapNodeModel in a loop. But we can easily copy the contents of SiteMapNodeModel into MySiteMapNode and then edit the code. Then we can just call our new template by editing MenuHelperModel as follows.

@model MvcSiteMapProvider.Web.Html.Models.MenuHelperModel
@using System.Web.Mvc.Html
@using MvcSiteMapProvider.Web.Html.Models

<ul id="menu">
    @foreach (var node in Model.Nodes) { 
        <li>@Html.DisplayFor(m => node) 
            @if (node.Children.Any()) {
                @Html.DisplayFor(m => node.Children, "MySiteMapNode")
            }
        </li>
    }
</ul>

Automatic Sitemaps XML Generation

In addition to giving you HTML helpers, MvcSiteMapProvider keeps track of each of your URLs so they can be submitted to search engines using the standardized Sitemaps XML format.

This feature is automatically enabled by default, just navigate to the path /sitemap.xml in your browser to see the output from your configured nodes.

More Information

MvcSiteMapProvider does a lot more than we can describe on one page, and it can also be extended in many ways - you can even replace much of the default behavior with your own code. Read the full documentation on our wiki, or for a tutorial visit MvcSiteMapProvider - A Test Drive.

Extra Configuration Steps for .NET 3.5

For .NET 3.5, you need to manually add the code to launch MvcSiteMapProvider to your Application_Start() event of the /Global.asax file. There is only 1 line required.

MvcSiteMapProvider.DI.Composer.Compose();

After adding that line, MvcSiteMapProvider will launch when you run the application, as it would for .NET 4.0 or higher.

Extra Configuration Steps for External DI Modules Packages

There is a readme file that opens up automatically when you install one of these packages with the code to add to your composition root. In case you need to reference it again, you can view the readme files online at the following locations.


Want to contribute? See our Contributing to MvcSiteMapProvider guide.



Version 3.x Documentation


Unofficial Documentation and Resources

Other places around the web have some documentation that is helpful for getting started and finding answers that are not found here.

Tutorials and Demos

Version 4.x
Version 3.x

Forums and Q & A Sites

Other Blog Posts

Clone this wiki locally