6

I need to rebrand default look of sharepoint suiteBar. I have no problems with logo or custom links but I need something more. I need to change whole look of suiteBar - background color, height, different placement of elements etc. - basically suiteBar can't look like sharepoint suiteBar :) and I have to do this for all site collections. What is more this solution need to be flexible - when I need another link or different color I will just change it and then all site collections get new masterpage with changes.

Is such thing possible? Not only add links to suiteBar but rework it completely using default sharepoint controls and functions which are located in suiteBar

4

If you're on on-prem environment, you can customize the SuiteBar, there's a delegate control for the SuiteBar which you can override.

For SP2013 online environment, you'd need to use jQuery to add links to it and CSS for changing color, font and styles.

  • I know about three DelegateControls in SP13: PromotedActions, SuiteBarBrandingDelegate, SuiteLinksDelegate and there I can change links, logo etc but where I can change look of suiteBar, I mean html structure. I am using on-prem environment. – omygoodness Jul 2 '14 at 0:08
4

The steps for changing the colour in SharePoint Online are:

  1. Navigate to Site Content --> Style Library --> desired language
  2. Create a new CSS file (if you already have a custom file you can append to that)

  3. Add the following CSS styles #O365_NavHeader, .o365cs-nav-rightMenus, #O365_MainLink_NavMenu

  4. Change the colour to suit your theme, note because Office365 writes the default values very specifically I had to put !important after every change to make it stick (not ideal)

  5. Save the CSS file
  6. Navigate to your masterpage file
  7. Add the CSS reference just above the placeholder with ID PlaceHolderAdditionalPageHead

  8. Save your masterpage and refresh, the styles should be applied

Microsoft have changed the CSS classes recently but these are valid currently.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.