April 25, 2024

SamTech 365

PowerPlatform, Power Apps, Power Automate, PVA, SharePoint, C#, .Net, SQL, Azure News, Tips ….etc

Fabric UI For Office 365 Customizations #ESPC2018

In this session, we will be discussing the customization that we can apply to SharePoint modern page.

Everyone knows that Sharepoint OOTB features are quite okay, the modern pages offer slightly better components and customization capabilities.

In the past, we had to apply multiple customizations to achieve the desired end goal.

why use fabric UI for customization?  Because it is what Microsoft uses !. And if we do, our customizations won’t look like something coming from another planet. I have personally been using sp.js with bootstrap to create custom solutions, but the users would feel the difference from the customized design to the OOTB pages

FabricUI, can be used with react or any other framework, but ideally, use it with React JS. In term of licensing, this is open source, so, it is somehow Free. Why somehow? Because there are some licensing limitations related to icons and fonts if used  in non-MS platforms. In other words, Fabric UI is totally free if using with Microsoft Technologies (in our case, SharePoint, or Teams customizations it applies), however, if you want to use the UI Fabric css for another platform (let’s say your web site, so this would be an issue, and you would need a proper licence, my advice, just go and pick bootstrap).

But as we are dealing with Microsoft platforms only, let’s continue 😉

As we are in 2018, no don’t need to worry *too much* about the compatibility, the Fabric UI is fully responsive (if you define your classes properly), and all the animations workin all the browsers.

In term of components, Fabric UI has loads of components,


In termof components, Fabric UI has loads of components

More details at: https://developer.microsoft.com/en-us/fabric

https://developer.microsoft.com/en-us/fabric

Custom templates for sites provisioning can also be created with fabric UI