OOTB Ribbon

SharePoint 2010 Hiding the Ribbon Browse Tab Button


The SharePoint 2010 OOTB Ribbon contains a browse button as shown below

OOTB Ribbon
OOTB Ribbon

This button exists to enable users to show the Title area, which gets hidden when selecting other tab buttons…

So, if you move the title area, or hide it etc, the browse button is surplus to requirements and can be removed as follows.

Add the following CSS to your stylesheet or masterpage

UL.ms-cui-tts  > LI.ms-browseTab[id='Ribbon.Read-title']
{ display:none!important; }

This hides the browse button, until you edit the page for example, or untill the ribbon gets loaded with other context related controls. In this case SharePoint resets the visibility of all tab buttons. In order to workaround this a small piece of jQuery is required.

// wait until the Ribbon is loaded, then loop through the ribbon tabs, if we find the browse tab hide it
   $("#RibbonContainer").ready(function () {
    $("#s4-ribboncont .ms-cui-tts li").each(function () {
     if ($(this).attr('id') == 'Ribbon.Read-title' && $(this).hasClass('ms-browseTab'))
         plmHideRibbon = true;
    });
    if (plmHideRibbon)
    { $("#RibbonContainer DIV.ms-cui-topBar2 UL.ms-cui-tts li.ms-browseTab[id='Ribbon.Read-title']").hide(); }
   });

Published by

Phil Harding

SharePoint Consultant, Developer, Father, Husband and Climber.

One thought on “SharePoint 2010 Hiding the Ribbon Browse Tab Button

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.