SharePoint 2013 Top links – Name, ID and How to Hide them

Follow Us :

Summary : SharePoint 2013 Top links – Name, ID and How to Hide them, Hide Deltasuite links in top blue bar SharePoint 2013, Hide SKYDRIVE, SITES, NEWSFEED, SHARE, FOLLOW, SYNC with JavaScript

As the post Title says this post is about the components that make the new Top Blue Bar and the Sharing menu. The Id’s of these components are sometimes required to Change the look and feel and very often to hide them. Hiding some of the icons like “FOLLOW”, “SYNC” or “NeesFeed, SkyDrive, Sites etc” gets important in the company when you no longer want the user’s to use them.

This post tells you about Id’s and the Names of the Top left and right bar(suite links) and the individual id’s of buttons like SHARE, FOLLOW, SYNC etc.You can however Override “SuiteLinksDelegate” Delegate Control and Customize\Add\Remove links in the Top suite bar.

For each component I have added a picture and a JavaScript that can be added to the Script Editor to hide it on a page.

 

 

 

Lets look at ID’s of each Component of the blue bar including all the Icons in Share suite of the Ribbon.

 

ffice 365 Preview icon

IDsuiteBrandingBox

 

How to Hide it

<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{
document.getElementById(‘suiteBrandingBox‘).style.visibility = ‘hidden';
}
</script>

 

NewsFeed, SkyDrive, Sites . – ..

IDDeltaSuiteLinks


 

How to Hide it –

<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{

document.getElementById(‘suiteLinksBox‘).style.visibility = ‘hidden';
}

</script>

See Related post SharePoint 2013 – Hide NewsFeed, SkyDrive, Sites (DeltaSuiteLinks) for more options.

User Welcome, Settings, Help ..

IDsuiteBarRight

 

 

 

 

 

How to Hide it –

<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{

document.getElementById(‘suiteBarRight‘).style.visibility = ‘hidden';
}

</script>

<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{

document.getElementById(‘ctl00_DeltaSuiteBarRight’).style.visibility = ‘hidden';
}

</script>

 

SHARE,FOLLOW, SYNC, EDIT –

IDRibbonContainer-TabRowRight

 

How to Hide it –

<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{

document.getElementById(‘RibbonContainer-TabRowRight‘).style.visibility = ‘hidden';
}

</script>
Next lets look at the Individual Id’s of SHARE, FOLLOW, SYNC, EDIT\SAVED & CLOSE and FULLScreen Mode

FOLLOW

ID – site_follow_button


How to Hide it –

<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{

document.getElementById(‘site_follow_button’).style.visibility = ‘hidden';
}

</script>

SYNC

ID – ctl00_SyncPromotedAction

 

 

How to Hide it –

<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{

document.getElementById(‘ctl00_SyncPromotedAction‘).style.visibility = ‘hidden';
}

</script>

 

EDIT\Save and Close

ID – ctl00_PageStateActionButton

 

How to Hide it –

<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{

document.getElementById(‘ctl00_PageStateActionButton‘).style.visibility = ‘hidden';
}

</script>

 

FULL Screen button

ID – ctl00_fullscreenmodeBtn

 

How to Hide it –
<script language=”javascript”>

_spBodyOnLoadFunctionNames.push(“HideBrandingsuite”);

function HideBrandingsuite()
{

document.getElementById(‘ctl00_fullscreenmodeBtn‘).style.visibility = ‘hidden';
}

</script>

Another way to Customize or hide these links is by Creating a Visual Studio Solution for Overriding SuiteLinksDelegate Delegate Control. See a Step-by-Step Tutorial at Add,Remove Links in Top Suite Bar (SKYDRIVE,SITES,NEWSFEED) in SharePoint 2013

Related Posts –

SharePoint 2013 Top links(NewsFeed, SkyDrive, Sites..) – Name, ID and How to Hide them



Tags: SharePoint 2013, SharePoint 2013 How To's