No one has responded to this discussion for at least a year, so this information may be out of date. If you're looking for information about this topic, please search for a more recent discussion or post a new question.

how to change the font for the navigation bar (public site)

  • Hi, Office365 P1 plan. I can't find a way to change the font (from the default) of the navigation bar (currently on the left hand side of the page). I can change the fonts in other web parts but can't figure this one out.


    any help/assistance much appreciated.


    thank you


    1 out of 1 people found this post helpful.

  • I think this was an oversight. In OLSB, the font option would change the site globally (including the nav font). That option in 365 only affects selected fonts within the editable areas.

    You can always adjust it using the custom stylesheet, but it should be subject to the font chosen in the editor.,   

  • Thanks for the response. I'm still somewhat confused (complete newbie to this). understand you mentioning the differences between O365 and OLSB which is far more customisable. However, I know next to nothing about CSS so consequently don't really know where to start or how to change it. Any advice would be much appreciated.

    again many thanks

  • There's a custom stylesheet icon in the page editor. Add any custom css to that box.

    To change site font globally add:


    To target the menu only:


  • Many thanks I'll give it a go.


    Once I figured out how to actually enter the css code the first one worked a treat. I did try the second but I can only imagine i pasted it incorrectly as it didn't actually change the font for the menu.


    The first option did what was required.


    thanks for your assistance and patience. It is very much appreciated.



  • Hi!,

    I've looked through the rest of the thread and it looks like mch has answered your questions perfectly!

  • newbie2,

    It's a bit hard reading in this forum-make sure you have a period before the element: and add an !important:

    .MSC_PrimaryNavLink{font-size:140% !important;}

  • Greetings, did you have anymore questions?
  • Where do I find the reference that lists all the of the elements such as .MSC_PrimaryNavLink and what they are used for?

    I am trying to change the width of all my public website something like 1000 instead of using the 100% and 980px options under page setup.