How To Hide Ribbon From Users Without Edit Page Privilege
Ribbon is a great new feature introduced by SharePoint 2010. It provides great user experience for users with elevated privileges, like contributors and site owners. However, for users with lease privilege, such as visitors and anonymous users, it seems like a big waste of page real estate. Because for those users, all ribbon provides are navigation breadcrumb and welcome control (user name with a drop down list on top-right corner).
So I have been asked to figure out a way to remove or hide the ribbon area from user with lease privilege, and here is how:
1) Open your SharePoint master page
2) Locate this line:
<div id="s4-ribbonrow" class="s4-pr s4-ribbonrowhidetitle">
3) Change it to:
<div id="s4-ribbonrow" class="s4-pr s4-ribbonrowhidetitle" style="display:none">
4) Now find the end of the “s4-ribbonrow” tag and add following block right after it:
<Sharepoint:SPSecurityTrimmedControl ID="SPSecurityTrimmedControl2" runat="server" PermissionsString="AddAndCustomizePages">
<script type="text/javascript">
document.getElementById("s4-ribbonrow").style.display = "block";
</script>
</Sharepoint:SPSecurityTrimmedControl>
5) Save the new master page and publish it.
Now when a user without “AddAndCustomizePages” access to view the site, they would not see the ribbon area. You may want to move at least the welcome control to somewhere outside the ribbon area so your lease privilege users can see their user names.
The reason that you have to do it the other way around: make the ribbon invisible (step 3) and make it visible only when users have “AddAndCustomizePages” access (step 4) is the ribbon HTML code has to be rendered to the browser otherwise you would lose some basic abilities on the page, like, to be able to scroll up and down.
Enjoy your page real estate back!
Zewei Song, Ph.D.
MCPD, MCTS: .NET 3.5, MOSS AppDev, Configuration
Enterprise Services, Microsoft Corporation
Comments
Anonymous
June 09, 2010
THANK YOU SO MUCH. I've been wracking my brain for a simple fix to this, and it just blows my mind that these kinds of options aren't just built into SharePoint in the first place.Anonymous
June 09, 2010
I agree with Christian. Low tech users are going to be lost in the menus. I prefer the simplicity of SP 2007 in this regard. This user interface is not fit for our grey haired users, unfortunately, they are the ones most of us have to please.. Just greying out icons makes it too busy for them.Anonymous
June 21, 2010
Very clever tip - and works a treat ! I had some other areas I needed to hide, and used this same technique - thanks for your post !! ;-)Anonymous
June 30, 2010
Hi All, How to display welcome control to all user, Please helpAnonymous
July 19, 2010
Hi, this works great except if you have calendar or other web part which normally interacts with the ribbon then clicking a calendar item or web part item still causes the ribbon area to overlay the site banner and top navigation area - but user then does not have the browse button to return the banner and nav and has to refresh page. How to work around this?Anonymous
July 24, 2010
This solution is mainly for anonymous users because the ribbon is mostly waste of space, especially for WCM sites. For users with some access, you'd better keep the ribbon on.Anonymous
August 02, 2010
Works great, But there is a Typo in the script....make sure u remove the space after "s4-ribbonrow" in the javascript....as shown here.... <script type="text/javascript"> document.getElementById("s4-ribbonrow").style.display = "block"; </script> Please give suggestions on how to display welcome control to all user...??Anonymous
August 12, 2010
Thanks neverontime for catching the typo. You can move the welcome control to somewhere outside the ribbon so everybody can see it.Anonymous
August 19, 2010
The comment has been removedAnonymous
September 06, 2010
Dr. Z, Many thanks for the tutorial. I have met a deadline because of this post and am very grateful! I'm a bit puzzeled how it works in my environment. I modified the page style as you suggested and proceded to login as a site visitor and saw no change. so I thought I'd made a mistake or some other anomoly. Wasn't untill I logged on to the site as a Member that I saw the behavior you wrote about aka ribbon gone. so with a bit of experimentation, I found that I could add manage hierarchy permission, or design to site members and give them the ribbon back. That I can understand. what totally baffles me is the visitor group, which has nothing but read permissions on the site, yet I can't seem to make the ribbon gone from that group. I have worked around the phenominon by assigning all members to the visitor group, and the former visitors to the members group. the results work if quirky. I would have thought from the name that the AddAndCustomizePages permission was given with manage hierarchy or design permission in SharePoint 2010. Explanations from the wise appreciated!Anonymous
September 19, 2010
Have you tried to use a product like BeyondTrust Privilege Manager to elevate the access to these pages? It should allow you access to this process as an admin, while leaving access to everything else at least privilege. BeyondTrust has a new "free version of Privilege Manager" (www.beyondtrust.com/PowerBroker-Desktops-Windows-Edition.aspx), which might work for you for free. Otherwise, the full product is rather amazing and could not only solve this issue, but all other applications requiring admin privileges.Anonymous
October 07, 2010
why not put the ribbon div & subsequent controls inside the security trim delegate control? ...Anonymous
October 28, 2010
I have a problem that I'm hoping someone will be able to help me with. I used this code to hide the ribbon from the majority of our users, and it worked perfectly. I have full control over our SharePoint site and I was able to see the ribbon, which is perfect because I need it, and all of our other users that had "contribute" permissions were not able to see the ribbon. The problem that I'm having now is that before (when I used your code) the majority of our users (..Authenticated users) permission's levels were set to "contribute," and this worked our perfectly because when they logged in the ribbon was hidde, and since I have admin and design rights, when I logged in I could see the ribbon. This is exactly what I want. Now I need to change all of our users to only having "READ" permissions so that they are unable to add documents to lists and libraries, but when I change their permissions from "contribute" to "read", the ribbon comes back on for them. I'm unclear how the permission level in your code (Add And customize Pages) relates to the user permissions (read, contribute, etc) and I'm wondering if you know how to hide the ribbon for users with only "read" permissions. Any help would be greatly appreciated as I have spend countless hours trying to figure this out.Anonymous
October 30, 2010
Alex, I explained why you can’t just simply wrap the ribbon div with a security trim control: you page would lose some important features, such as vertical scroll bar. arodriguez, your "read only" users must have "AddAndCustomePage" permission. Here is a list of all permissions that you can try with the security trim control: msdn.microsoft.com/.../microsoft.sharepoint.spbasepermissions.aspx. Unfortunately, I couldn’t find any information regarding how the permissions are related to SharePoint user security levels.Anonymous
December 16, 2010
I need some help with timming the security of the ribbonrow. I dont want users with read rights only to see the ribbon. The problems I run into are:
- if i dont specify PermissionContext, an user who has contribute rights on a folder only doesnt see the bar. I think this property goes by default to "CurrentSite". Therefore i need to specify the context="CurrentFolder" in the spSecurityTrimmedControl 2)if i do specify the permissionContext, then everything is fine, except that when i am at teh site level (and NOT on a list or folder), i dont see the ribbon (i have farm & site collection rights). For example, i can not grant/edit groups permission on teh root site, because the ribbon is not visible, or when i go in SiteSettings, the ribbon is gone as well. This gets fixed by removing the PermissionContext in the master, but then in run into problem1. Here os my code: I have display:none on the div called "s4-ribbonrow" and then <div id="s4-ribbonrow" class="s4-pr s4-ribbonrowhidetitle" style="display:none;"> <div id="s4-ribboncont"> ........ </div> </div> <Sharepoint:SPSecurityTrimmedControl ID="SPSecurityTrimmedControl2" runat="server" PermissionsString="AddAndCustomizePages, ManageLists, AddListItems, EditListItems, DeleteListItems, ManagePermissions,CreateGroups" PermissionContext="CurrentFolder" PermissionMode="Any"> <script type="text/javascript"> document.getElementById("s4-ribbonrow").style.display = "block"; </script> </Sharepoint:SPSecurityTrimmedControl>
Anonymous
January 11, 2011
Hi, Thanks for the solution, but it doesnt seem to work for me. Is there any way i can troubleshoot this ? Thanks in advance!Anonymous
January 13, 2011
Hi Roland, what is your issue?Anonymous
January 16, 2011
Hi zwsong, thanks for your reaction. Its working! :) i forgot an " stupid me... But maybe you can help me out with moving the login button outside the ribbon ? Roland.Anonymous
January 18, 2011
Thanks for the post Dr. Z, this is exactly what I was searching for! However, when a user without AddAndCustomizePages access clicks on a web part, the entire top navigation disappears like it would if the ribbon were there. I tried doing some digging but can't find why this is happening and how to fix it. Any suggestions? Thanks, ZebAnonymous
January 23, 2011
Zeb, this solution is meant for getting rid of the ribbon for read-only users, like anonymous visitors. If a user has access to personalize web parts, then he/she should see the ribbon.Anonymous
February 08, 2011
Hi, cool idea - thanks a lot for sharing. I think the more elegant solution would be to unhide the ribbon with css rather than with javascript - buts only a small improvment. <Sharepoint:SPSecurityTrimmedControl ID="SPSecurityTrimmedControl2" runat="server" PermissionsString="AddAndCustomizePages"> </Sharepoint:SPSecurityTrimmedControl> Cheers MaxAnonymous
February 10, 2011
Good idea MaxMelcher. Can you share your CSS solution?Anonymous
June 09, 2011
Hi Dr. Z, It works. Thank you so much for your help. Really appreciate it. Cheers, AlexAnonymous
June 10, 2011
Thanks for the info.Anonymous
July 28, 2011
when i click on a list or webpart it chops off the area with top links and bread cumbs as a result of this modification, can i hide the ribbon but not have it do thisAnonymous
September 09, 2011
The ribbon should only show what you can do and not gray out things. Stupid UI design on the MS team. Seems the teams at microsoft only deal with technical and geeky types and do not have to face "real" users. Time and time again, they put out things that end users and administrators end up using unproductive hours trying to resolve and find workarounds on things that are obvious from so many admins that they should not even show up.Anonymous
October 27, 2011
Dr Z - How do I turn off Edit Page for contributor and leave all other default rights enable?Anonymous
December 12, 2011
Thnkx Dr. Z, This was really helpful for me.Anonymous
April 24, 2012
Thanks Dr. Z. That was exactly what we needed!Anonymous
May 16, 2012
Thanks Dr. Z, works !!Anonymous
June 09, 2012
Good Idea! I like it very much!Anonymous
July 02, 2012
The comment has been removedAnonymous
July 04, 2012
Thank very much for the info, was helpful and easy to use, after searching the web this is the best. greetings OAAnonymous
July 10, 2012
Justin, glad this old bolg post helped you.Anonymous
August 23, 2012
This worked great for me except that it also hides our footer which is in a div just above the DeveloperDashboard. Any ideas?Anonymous
September 11, 2012
thanks a lot its intelligent and saved a lot of effort...Anonymous
September 24, 2012
Hi i wanna hide the Modify the view option for a particular Group of user. how can i aceheive that. i can make the display none for Modify the view by using its ID or Class but how to i check for the users group.Anonymous
November 19, 2012
Hello, This works and hides the top blue bar, but I still have the grey area below along with the white bar with the search. I've "hidden' those areas with designer but the space is still being used up by them at the top. I would like to regain that realstate at the top. I looked and the area seems to be titled: table.s4-titletable for the grey area and div#s4-topheader2.s4-pr s4-notdlg for the white are with the search field. These are both in the "s4-workspace" area. If I hide that.. it hides the whole page. Have I done something incorrectly? Is there a way to regain that realstate at the top? ThanksAnonymous
January 06, 2013
Thank you very much, it really helped us.Anonymous
April 15, 2013
Would this work for anonymous users. If a site has anonymous access enabled, would this solution remove the ribbon when they navigate to the site??????Anonymous
April 16, 2013
This works nicely... Thanks for the post, very helpful..Anonymous
November 12, 2013
Its working thanks :)Anonymous
December 18, 2013
Dr. Z. Thank you for the tip ! I was injecting all the ribbon controls inside the trimming before reading this. For those of you that need secure trimming for a SharePoint Group/s instead of OOB SharePoint roles: here you can find a solution with little coding, just overwriting the trimming control: www.dhirendrayadav.com/.../extending-sharepoint-security-trimmed.html Cheers !Anonymous
March 11, 2014
I'm working on a Sharepoint project with a client that wanted to get rid of the ribbon....this solution worked like a dream, and was so easy to implement! Thank you, you're a lifesaver :-)Anonymous
March 24, 2014
thanks .. was a great helpAnonymous
April 10, 2014
The comment has been removedAnonymous
June 29, 2014
This is perfect soluation!!Anonymous
July 20, 2014
what are you doing, guys! Do you really think, that hiding is a solution!!!!! any noob can set display property to block and show it, having some functionality!!!!! I think, that you can even don't show it at all!!!! So it won't be in html, received from server side!Anonymous
April 27, 2015
I used permissionsstring="ManagePermissions" to show ribbons only for Full Control users. Worked well. Thanks a lot.Anonymous
June 28, 2015
Hi Dr Z, Thank you, its working. :)Anonymous
July 20, 2015
Easier Solution to Show and Hide the Ribbon WORKS FOR ALL 2010/2013 VERSIONS OF SHAREPOINT: THIS IS THE LOCKED DOWN VERSION PUT THIS CSS IN YOUR MASTER PAGE (IT WILL HIDE THE RIBBON FROM EVERYBODY) THEN PUT THIS JAVASCRIPT IN THE BOTTOM OF YOUR MASTER PAGE basically it triggers visibility of ribbon if user is in a certain group <script> SP.SOD.executeFunc('sp.js', 'SP.ClientContext', GetUserGroup(24)); SP.SOD.executeFunc('sp.js', 'SP.ClientContext', GetUserGroup(56)); SP.SOD.executeFunc('sp.js', 'SP.ClientContext', GetUserGroup(78)); SP.SOD.executeFunc('sp.js', 'SP.ClientContext', GetUserGroup(124)); function GetUserGroup() { var ContextUserGroup = new SP.ClientContext(groupno); var groupCollection = ContextUserGroup .get_web().get_siteGroups(); group = groupCollection.getById(groupno); //The ID of the SharePoint user group groupUsers = group.get_users(); ContextUserGroup.load(group); ContextUserGroup.load(groupUsers); currentUsergroup = ContextUserGroup.get_web().get_currentUser(); ContextUserGroup.load(currentUsergroup); ContextUserGroup.executeQueryAsync(Function.createDelegate(this, this.onUserFound), Function.createDelegate(this, this.onUserNotFound)); } function onUserFound() { //alert(groupUsers.get_count()); if (groupUsers.get_count() > 0) { var UserExistInGroup = false; for (var i = 0; i < groupUsers.get_count() ; i++) { if (groupUsers.itemAt(i).get_loginName() == currentUsergroup.get_loginName()) { UserExistInGroup = true; //alert("hide"); break; } } } if (UserExistInGroup) { //Show the content based on the user's group document.getElementById("s4-ribbonrow").style.display = 'block'; document.getElementsByClassName("s4-ribbonrowhidetitle").style.display = 'block'; } } </script> NOW JUST IN CASE YOU NEED TO STILL GIVE ACCESS TO USERS WHO MAY ONLY NEED TO SEE THE RIBBON ON A CERTAIN PAGE ADD THIS CODE BELOW THE PREVIOUS JAVASCRIPT CODE <script type="text/javascript"> var pathname = window.location.pathname; if (pathname.indexOf("calendar.aspx") >= 0){ document.getElementById("s4-ribbonrow").style.display = 'block'; document.getElementsByClassName("s4-ribbonrowhidetitle").style.display = 'block'; } </script>Anonymous
February 16, 2016
hi, thank you for the explanation of essential notes about share point. i have problem when implementing of the 5 stages mentioned above. my problem is in the 4stage . i do not know exactly where and what i have to copy and paste. please guide me in a more detailed way. after doing the 4 stage, the ribbon do not get hidden. thanksAnonymous
March 27, 2016
Simple and Awesome stuff.... Thanks a lot...!!!