Monday, April 29, 2013

Hiding "Home" Link in SharePoint 2013 Top Navigation

By default, the SharePoint top navigation includes a link to the landing page. This "Home" link takes up space and isn't always useful, especially if you use the site logo for the same purpose!

Sometimes the best solution can be to make changes in the master page or generate the nav from a list, but from time to time, the easiest approach was just to hide that first node with CSS. In SharePoint 2010, you'd end up using something like:

.s4-tn li.static > a{
display: none !important;
}
.s4-tn li.static > ul a{
display: block !important;
}

In SharePoint 2013, styles have changed. Here's the new class:

.ms-core-listMenu-horizontalBox li.static > a{
display: none !important;
}
.ms-core-listMenu-horizontalBox li.static > ul a{
display: block !important;
}