How to Hide the SharePoint Ribbon

September 25, 2014

When it comes to SharePoint there’s this menu called the ribbon. From my experience this menu is not really customizable and generally only used by administrators.

Sharepoint-ribbon-edit-mode

Sharepoint-ribbon

Our company has always just hid this menu and designed our own menus for the site instead.

UFACIP-Custom-Menu

We have generally used two different methods for hiding the ribbon depending on the site’s needs.

Option 1: Simple CSS.

#s4-ribbonrow, #suiteBar { display: none; }

You can make this global by sticking this into a CSS file or specific to a master page. Some of our projects have a master page for normal users where they would not want to see the ribbon, and a separate web application that uses a different master page for administrators. This solution is great if you have admin/users separated like so, however if you have these two different types of users viewing the same pages you need a more dynamic solution.

Option 2: The use of SPSecurityTrimmedControl.

<SharePoint:SPSecurityTrimmedControl PermissionsString="ManagePermissions" runat="server">

<div id="s4-ribbonrow">

</div>

</SharePoint:SPSecurityTrimmedControl>

By using the SPSecurityTrimmedControl you can control whether the user sees the ribbon or not based on their permissions. This is more dynamic from the first option as all users can view the same page and have different controls based on their permission level.