Forum Discussion

Isha Kapoor's avatar
Isha Kapoor
Copper Contributor
Sep 09, 2020

Modifying Hub navigation\Mega Menu Font Size

Hi, 

 

We have a hub site as a main intranet with several associated sites. The ask from customers is to make the hub navigation bold or larger font. 

 

Is there a way to modify font size for hub navigation? Anyway using Application Customizers?

We do not want to create our own control as it should be manged through the out-of-the box navigation settings. 

Any quick modification that we can do?

Hub Site
SharePoint Online Office 365
spfx extensions
  • ganeshsanap's avatar
    ganeshsanap
    MVP
    Oct 26, 2022

    Isha Kapoor You can inject custom CSS using SPFx application customizer to make hub navigation bold like: 

     

    a.ms-HorizontalNavItem-link {
    font-weight: bold !important;
}

     

    Output: 

    Check my answer for more information at: How can I include JS and CSS files on SharePoint Modern Page? 

    Note: DOM manipulation & CSS customizations are not recommended by Microsoft and some of your customization may break if Microsoft changes HTML element id/classes in new release updates.

    Please click Mark as Best Response & Like if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.

Resources