Menu in ASP.Net MVC 5 or mvcsitemapprovider mvc5 or mvc sitemap provider tutorial or mvc sitemap provider tutorial

Here I will show Menu in ASP.Net MVC 5...

Out Put :

01. Install MvcSiteMapProvider.MVC5 from NuGet. 

02. Change Web.Config as shown below in <System.Web>

<system.web>   

        <siteMap defaultProvider="MvcSiteMapProvider">

              <providers>

              <clear />

              <add name="MvcSiteMapProvider" type="MvcSiteMapProvider.DefaultSiteMapProvider,

         MvcSiteMapProvider" siteMapFile="~/MVC.Sitemap" />

               </providers>

               </siteMap>

</system.web>

03. Open MVC.Sitemap and replace the entire(all) tags

<?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="Masters" clickable="false" >

      <mvcSiteMapNode title="EnumMaster" controller="EnumMaster" action="Index" />

    </mvcSiteMapNode>

    <mvcSiteMapNode title="Enquiries" clickable="false" >

      <mvcSiteMapNode title="Enquiry 1" controller="Enquiry1" action="Create" />

      <mvcSiteMapNode title="Enquiry 2" controller="Enquiry2" action="Create" />

      <mvcSiteMapNode title="Status of Enquiries" clickable="false">

      <mvcSiteMapNode title="Status of Enquiry 1" controller="Enquiry1Status" action="E1Status"/>

      <mvcSiteMapNode title="Status of Enquiry 2" controller="Enquiry2Status" action="E2Status"/>

      </mvcSiteMapNode>

    </mvcSiteMapNode>

    <mvcSiteMapNode title="Contact" controller="Home" action="Contact" />

    <mvcSiteMapNode title="Administration" clickable="false">

      <mvcSiteMapNode title="User Mgmt" controller="Home" action="UserMgmt" />

      <mvcSiteMapNode title="Role Mgmt" controller="Home" action="RoleMgmt" />

    </mvcSiteMapNode>

    <mvcSiteMapNode title="Profile" clickable="false">

      <mvcSiteMapNode title="Change Password" controller="Home" action="ChangePassword" />

      <mvcSiteMapNode title="Separator" clickable="false" />

      <mvcSiteMapNode title="Sign Off" controller="Home" action="SignOff" />

    </mvcSiteMapNode>

  </mvcSiteMapNode>

</mvcSiteMap>

04. Add below CSS to site.css present in Content Folder as show below to support SubMenu Item

/* Bootstrap Dropdown Submenu */

.dropdown-submenu {

    position: relative;

}

.dropdown-submenu > .dropdown-menu {

    top: 0;

    left: 100%;

    margin-top: -6px;

    margin-left: -1px;

    -webkit-border-radius: 0 6px 6px 6px;

    -moz-border-radius: 0 6px 6px 6px;

    border-radius: 0 6px 6px 6px;

}

.dropdown-submenu:hover > .dropdown-menu {

    display: block;

}

.dropdown-submenu > a:after {

    display: block;

    content: " ";

    float: right;

    width: 0;

    height: 0;

    border-color: transparent;

    border-style: solid;

    border-width: 5px 0 5px 5px;

    border-left-color: #cccccc;

    margin-top: 5px;

    margin-right: -10px;

}

.dropdown-submenu:hover > a:after {

    border-left-color: #ffffff;

}

.dropdown-submenu.pull-left {

    float: none;

}

.dropdown-submenu.pull-left > .dropdown-menu {

    left: -100%;

    margin-left: 10px;

    -webkit-border-radius: 6px 0 6px 6px;

    -moz-border-radius: 6px 0 6px 6px;

    border-radius: 6px 0 6px 6px;

}

.navbar-nav .divider-vertical {

    height: 40px;

    margin: 0 9px;

    border-left: 1px solid #f2f2f2;

    border-right: 1px solid #ffffff;

}

05. Add a file named as BootstrapMenuHelperModel.CSHTML in shared/DisplayTemplates

06. Copy below code and paste in above created file.

@model MvcSiteMapProvider.Web.Html.Models.MenuHelperModel

@using System.Web.Mvc.Html

@using MvcSiteMapProvider.Web.Html.Models

@helper  TopMenu(List<SiteMapNodeModel> nodeList)

{

    <nav class="navbar navbar-default" role="navigation">

        <div class="container-fluid">

            <div class="collapse navbar-collapse">

                <ul class="nav navbar-nav">

                    @foreach (SiteMapNodeModel node in nodeList)

                    {

                        string url = node.IsClickable ? node.Url : "#";

                        if (!node.Children.Any())

                        {

                            <li><a href="@url">@node.Title</a></li>

                        }

                        else

                        {

                            <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown">@node.Title <span class="caret"></span></a>@DropDownMenu(node.Children)</li>

                        }

                        if (node != nodeList.Last())

                        {

                            <li class="divider-vertical"></li>

                        }

                    }

                </ul>

            </div>

        </div>

    </nav>

}

@helper DropDownMenu(SiteMapNodeModelList nodeList)

{

    <ul class="dropdown-menu" role="menu">

        @foreach (SiteMapNodeModel node in nodeList)

        {

            if (node.Title == "Separator")

            {

                <li class="divider"></li>

                continue;

            }

            string url = node.IsClickable ? node.Url : "#";

            if (!node.Children.Any())

            {

                <li><a href="@url">@node.Title</a></li>

            }

            else

            {

                <li class="dropdown-submenu"><a href="@url">@node.Title</a>@DropDownMenu(node.Children)</li>

            }

        }

    </ul>

}

@TopMenu(Model.Nodes)

07. In _Layout.cshtml within Body Tag write below HTML

        <div class="row">

            <div class="span12">

                <nav>

                    @Html.MvcSiteMap().Menu("BootstrapMenuHelperModel")

                </nav>

            </div>

        </div>

For Other .Net Frameworks 

.NETFramework 3.5

• MvcSiteMapProvider.MVC5.Core
• MvcSiteMapProvider.Web

.NETFramework 4.0

• MvcSiteMapProvider.MVC5.Core
• MvcSiteMapProvider.Web
• WebActivatorEx

Download the entire Code From Here