Umbraco 9 - Left hand sub page navigation code snippet.

Umbraco 9 - Left hand sub page navigation code C# RAZOR snippet. 

The code below can be used for left hand navigation in Umbraco 9 to create left hand/sub page navigation. 

Instructions: 

1. Create a partial _leftHandNavigation 
2. Reference the partial in your Umbraco template, like this: @Html.Partial("_leftHandNavigation")

Code:

	@inherits Umbraco.Web.Mvc.UmbracoViewPage
	@{
	var selection = Model.AncestorOrSelf(2)
	.Children()
	.Where(x => x.IsVisible());
	}
	<ul class="list-group listy">
	<li><a href="@Model.AncestorOrSelf(2).Url" class="head list-group-item">@Model.AncestorOrSelf(2).Name </a></li>
	@foreach (var item in selection)
	{
	if(item.Id == Model.Id)
	{
	<li>
	<a href="@item.Url" class="list-group-item current">@item.Name</a>
	</li>
	}
	else
	{
	<li>
	<a href="@item.Url" class="list-group-item">@item.Name</a>
	</li>
	}
	}
	</ul>

view raw Umbraco-9 Left-Hand-Navigation.cshtml hosted with ❤ by GitHub

Example output:

---

https://www.buymeacoffee.com/markdevelopment/umbraco-side-bar-left-hand-navigation