Presented during SharePoint Conference 2019. Session reviews customization capabilities in Modern SharePoint and how to choose the correct path

1. Empowering business users
with flexible SharePoint
customization
Dave Feldman, MVP
1
Bob German D’arce Hess, MVP
SharePoint Conference North America

2. page 2
Session Objectives
Understand
Understand the full range of modern SharePoint
customization options.
Identify
Help you identify the simplest solution to achieve
your business outcomes.
Unblock
Unblock your use and customization of
Communication and Modern Team sites.

3. 3
2015 Our Inspiration
Engineering Next Gen Portals
Ignite 2015

4. page 4
Four Areas of Customization
Out of the Box
Theming
List/Libraries
Microsoft Forms
Hub Sites
Modern Pages/Page Templates
Configure
Column Formatting/View
Formatting
List Forms with PowerApps
PowerApps
Flow
PowerBI
Extend
SPFx Packages from 3rd Party or
PnP
Site Designs/Site Scripts
PnP SharePoint Modernizer
Custom
SPFx Full Page Apps
SPFx App Customizers
SPFx Web Parts
Classic AddIns
API Based Solutions

5. 5
What can you do natively in SharePoint
Out of the Box

6. 6
Office365 Themes
Color of Suite Bar
Add a logo
Background Image
Text color
Accent Color
App Launcher Color
Admin Center -> Organizational Profile ->
Manage custom themes for your
organizations

7. 7
SharePoint
Modern Themes
Link color
Background color
Accent colors for web parts
Section background
Header Background

8. 8
Theme Builder
https://aka.ms/spthemebuilder
https://dfeldman.me/FabricThemes
https://dfeldman.me/FabricThemes
Classic Builder
Newly Released Builder

9. page
Implement using Powershell
9
Add-SPOTheme

11. 11
Hub Sites
Used to associate topic or
organizationally related sites
with a common navigation,
news and events
https://docs.microsoft.com/en-us/sharepoint/create-
hub-site

12. 12
Modern Page Model
Site Pages
Sections
Web Parts

13. page 13
Page Templates
Pre-configured pages with web parts and heading available
News Service Overview Location
Provides a consistent experience for users.
Developers and Admins can use Powershell to implement
Easily create a template from any configured page

14. 14
Page Template
Powershell
Install the SharePoint PnP
Powershell module

16. 16
Low Code Customizations
Configure

17. 17
Column
Formatting
Uses JSON to format a specific
column
Examples:
Status color
Time remaining
Alerts

18. 18
View Formattinghttps://github.com/SharePoint/sp-dev-list-
formatting/tree/master/view-samples
Replacement for jslink use cases
Uses JSON to alter the view of
the items in a list
https://github.com/SharePoint/sp-dev-list-
formatting/tree/master/view-samples

20. 20
PowerApps & Flow
Powerful combo used for the
creation of forms and workflow
in the modern world

22. 22
Power BI
Uses a data source to visualize
data.

24. 24
Extend SharePoint with additional capabilities
Extend

25. 25
Lightly Coded
https://github.com/SharePoint/sp-dev-
solutions/tree/master/solutions/LinksAn
dHandlebarsTemplate
Use HTML, CSS and javascript to
create singular use solutions

27. 27
Site Designs
Modern SharePoint Templating Mode
A new approach for extending
modern templates post-creation to automate
the custom configuration of sites.​
Site design runs one or more Site Scripts to apply
custom “actions” to a site after creation.
Run from:​
Self-Service Site Creation​
PowerShell​
Joining a Hub​
Run again and again to update sites​
(if you’re careful… test early and often!)​

28. page
Anatomy of Site Design & Site Scripts
28

30. page 30
Available Site Script Actions
Constantly Updated / JSON Schema: https://docs.microsoft.com/en-us/sharepoint/dev/declarative-customization/site-design-json-schema
Site Settings SharePoint Components Apps & Solutions
• addPrincipalToSPGroup
• addNavLink
• applyTheme
• setSiteLogo
• setRegionalSettings
• setSiteExternalSharingCapa
bility
• triggerFlow
• joinHubSite
• createSPList
• addSPField
• deleteSPField
• addSPFieldXml
• createSiteColumn
• createSiteColumnXml
• addSiteColumn
• addContentType
• createContentType
• removeContentType
• addSPView
• removeSPView
• setSPFieldCustomFormatter
• installSolution
• SPFx Extension support!
• associateExtension
• associateListViewCo
mmandSet
• associateFieldCustom
izer

31. 31
Site Modernization
https://github.com/SharePoint/sp-dev-
modernization
Transforms current "classic"
SharePoint usage into "modern"
usage, e.g. using modern site pages
instead of classic wiki pages or Office
365 Group connecting of classic sites.

32. 32
Full custom coded solutions
Custom

33. 33
SPFx Extensions
Application Customizers. Adds scripts to the
page, and accesses well-known HTML element
placeholders and extends them with custom
renderings.
Field Customizers. Provides modified views to
data for fields within a list.
Command Sets. Extends the SharePoint
command surfaces to add new actions, and
provides client-side code that you can use to
implement behaviors.

35. page
35
SharePoint Framework Web Parts
Using SharePoint Framework to create new
custom web parts for users
https://github.com/SharePoint/sp-dev-
solutions/tree/master/solutions/LinksAndHandle
barsTemplate
https://docs.microsoft.com/en-
us/sharepoint/dev/spfx/sharepoint-framework-
overview
Hub Custom Web Parts - PnP
Get Started with SharePoint Framework

37. 37
SPFx Single Part App
Pages
https://docs.microsoft.com/en-
us/sharepoint/dev/spfx/web-
parts/single-part-app-pages
Single part app pages provides a
capability to host SharePoint
Framework web parts or Teams
applications in SharePoint Online with
a locked layout

38. 38
Classic Add-Ins
https://docs.microsoft.com/en-
us/sharepoint/dev/sp-add-
ins/sharepoint-add-ins
Use HTML, CSS and javascript to
create singular use solutions

39. 39
API Based Solutions
Custom applications built on Azure or externally
hosted that pull in content from SharePoint and
Microsoft Graph APIs.

42. Thank you!
Please leave feedback and have a great conference
Dave Feldman, MVP
42
Bob German D’arce Hess, MVP