June 23, 2024

SamTech 365

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

Building Modern Portal Solution with SharePoint Online and SPFX #ESPC2018

Organizations use Sharepoint differently and for various purposes. They can also be interested in customizing the look and feel, and have specific features enabled/disabled.

In the classic modal exceptions, we use to

  • For custom header, footer -> Use custom actions | Use custom master pages.
  • For custom branding –> HTML, CSS, JavaScript & Custom CSS,
  • For Custom content -> Page Metadata,
  • Targeted content & customized search experience -> Audiences and custom web parts …etc.

In the modern design, most of these customizations can be achieved using :

The SharePoint Starter Kit (PnP) , which is an Open Source solution, which can be used to demo the capabilities (to customers), or to build you own code and re-use anywhere –> More details at https://github.com/SharePoint/sp-starter-kit . This kits comes with loads of components, which you can re-use to buid nice solutions.

You need to chose the right site template for the right needts:

  • Communication site –> News, articles, company intranet
  • Moder Team site -> Collaboration, shared calendar, shared mailbox, planner, microsof teams.
  • Moder Tem site no-group -> Content sharing with no full collaoration stack. You can later groupify it to upgrade it.

Provisionning and deployment can be achieved with Site Designs and Site Scripts. These can be used to provisions basic artifacts (such as Fields, Content Types, Lists, etc .)

For full provisionning you can also use PnP Remote Provisioning.

For even widers and larger provisioning, you can combine Site Design, Site Action, Pnp Provisioning and Flow.

Please keep in mind that there is no more access to the Master pages in the modern branding.

No more Css Overrinding, and no more JS embedding.

However, we can use SPO Custom themes for color palettes,

For headers/footers and managed navigation you can:

  • Build it using the web UI
  • PnP Power Shell
  • Pnp Sites Core
  • Pnp Provisioning engine

You can also build SharePoint Mega Menu