You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
description: Apply a custom theme to a "modern" team site in SharePoint Online.
4
+
ms.date: 11/08/2017
4
5
---
6
+
5
7
# Customizing "modern" team sites
6
-
During the autumn of 2016 the SharePoint Online team released "modern" collaboration sites. These modern team sites are integrated with Office 365 groups and bring a greatly improved end user experience. "Modern" team sites are responsive by design and they are much faster to create and use from an end user perspective. Here are some of the key benefits in the "modern" team sites.
7
8
8
-
- Designed to scale for any device natively without customizations - fully responsive experience
9
+
In 2016, the SharePoint Online team released "modern" collaboration sites. These "modern" team sites are integrated with Office 365 groups and bring a greatly improved end user experience. "Modern" team sites are responsive by design and are much faster to create and use from an end user perspective. Following are some of the key benefits in the "modern" team sites:
10
+
11
+
- Designed to scale for any device natively without customizations, a fully responsive experience
9
12
- Native news, quick links, and activity capabilities
10
13
- Office 365 group integration
11
14
- Significantly faster to create compared to "classic" team sites
12
15
- Modern lists and libraries with support for Microsoft Flow and PowerApps
13
16
- Modern page editing capabilities
14
17
- Updated site contents page with additional insights on site usage
15
18
16
-
This article concentrates on the available extensibility options within "modern" team sites. Here are key links around the key capabilities:
19
+
This article concentrates on the available extensibility options within "modern" team sites:
17
20
18
-
- New capabilities in SharePoint Online team sites including integration with Office 365 Groups: https://blogs.office.com/2016/08/31/new-capabilities-in-sharepoint-online-team-sites-including-integration-with-office-365-groups
19
-
- Create connected SharePoint Online team sites in seconds: https://blogs.office.com/2016/11/08/create-connected-sharepoint-online-team-sites-in-seconds
20
-
-[Turn scripting capabilities on or off](https://support.office.com/en-us/article/Turn-scripting-capabilities-on-or-off-1f2c515f-5d7e-448a-9fd7-835da935584f)
21
+
-[New capabilities in SharePoint Online team sites including integration with Office 365 Groups](https://blogs.office.com/2016/08/31/new-capabilities-in-sharepoint-online-team-sites-including-integration-with-office-365-groups)
22
+
-[Create connected SharePoint Online team sites in seconds](https://blogs.office.com/2016/11/08/create-connected-sharepoint-online-team-sites-in-seconds)
23
+
-[Allow or prevent custom script](https://support.office.com/en-us/article/Allow-or-prevent-custom-script-1f2c515f-5d7e-448a-9fd7-835da935584f?ui=en-US&rs=en-US&ad=US)
21
24
22
-
>**Important:**
23
-
We're not deprecating the "classic" experience, both "classic" and "modern" will coexist.
25
+
>[!IMPORTANT]
26
+
> We're not deprecating the "classic" experience; both "classic" and "modern" will coexist.
24
27
25
-
_**Applies to:** SharePoint Online_
26
-
27
-
## Supported customizations in "modern" team sites
28
28
<aname="supportedcustomizations"> </a>
29
+
## Supported customizations in "modern" team sites
29
30
30
-
"Modern" sites have a different level of customization options compared to "classic" team sites. Over time we'll introduce additional customization options, mainly focusing on extensibility and branding. The list below gives a quick overview of the supported capabilities for "modern" team sites.
31
+
"Modern" sites have a different level of customization options compared to "classic" team sites. Over time we'll introduce additional customization options, mainly focusing on extensibility and branding. The following list gives a quick overview of the supported capabilities for "modern" team sites:
31
32
32
33
- Apply a custom theme / change the logo
33
-
- Apply an out of thebox theme
34
-
- Custom Site columns (fields) and content types
34
+
- Apply an out-of-the-box theme
35
+
- Custom site columns (fields) and content types
35
36
- Lists and libraries
36
-
- Site configurations, like regional settings, languages and auditing settings
37
+
- Site configurations, such as regional settings, languages, and auditing settings
37
38
38
-
> **Note:**
39
-
> By default a "modern" team site has scripting capabilities turned off. You can still apply a custom theme, but you cannot introduce a custom theme to the theme gallery as an option for end users. If you want to add a theme to the theme gallery you need to [enable scripting](https://support.office.com/en-us/article/Turn-scripting-capabilities-on-or-off-1f2c515f-5d7e-448a-9fd7-835da935584f) on the site.
39
+
> [!NOTE]
40
+
> By default, a "modern" team site has scripting capabilities turned off. You can still apply a custom theme, but you cannot introduce a custom theme to the theme gallery as an option for end users. If you want to add a theme to the theme gallery, you need to [enable scripting](https://support.office.com/en-us/article/Turn-scripting-capabilities-on-or-off-1f2c515f-5d7e-448a-9fd7-835da935584f) on the site.
40
41
41
-
### What's not supported with "modern" team sites?
42
42
<aname="notsupported"> </a>
43
+
### What's not supported with "modern" team sites?
43
44
44
-
There are numerous areas in the "modern" team sites where the typical customizations are not at least currently available. There will be further support for some of these specific topics when they are ready to be released. Below is a list of currently unsupported customizations in "modern" team sites:
45
+
In numerous areas on the "modern" team sites, the typical customizations are not currently available. Further support will be available for some of these topics when they are ready to be released. Following is a list of currently unsupported customizations on "modern" team sites:
45
46
46
-
- Custom master pages - More extensive branding will be supported later using alternative options
47
+
- Custom master pages; more extensive branding will be supported later using alternative options
47
48
- Changing "modern" site to use classic seattle.master or oslo.master
48
-
- Custom page layouts - We are looking to have support for multiple canvases in the future
49
-
- Enabling site or site collection scoped publishing features. Technically features can be currently activated, but this is not supported configuration.
50
-
- User custom actions / Custom JavaScript - There will be a more controlled way to embed JavaScript on the pages through the SharePoint Framework Extensions (currently in dev preview)
51
-
- "Modern" sub sites - Sub sites created in "modern" team sites use the "classic" experience, but you can change the user experience to be similar to "modern" sites
52
-
- Control available sub site template options
49
+
- Custom page layouts; we are looking to have support for multiple canvases in the future
50
+
- Enabling site or site collection scoped publishing features; technically, features can be currently activated, but this is not a supported configuration.
51
+
- User custom actions / custom JavaScript; there will be a more controlled way to embed JavaScript on the pages through the SharePoint Framework Extensions (currently in dev preview)
52
+
- "Modern" subsites; subsites created in "modern" team sites use the "classic" experience, but you can change the user experience to be similar to "modern" sites
53
+
- Control available subsite template options
53
54
- "Classic" publishing features (WCM)
54
-
- Activating community feature or creating community sub sites under modern" team site
55
+
- Activating community feature or creating community subsites under "modern" team site
55
56
56
-
Since "modern" team sites also have scripting capabilities disabled (it's a so called 'noscript' site), there are numerous additional areas which cannot be customized. The impact of 'noscript' is the same for "modern" or "classic" sites. "Modern" sites have 'noscript' by default enabled, meaning that scripting capabilities are not available. It is however possible and supported to disable 'noscript' setting in both "modern" and classic sites to further enable some capabilities.
57
+
Because "modern" team sites also have scripting capabilities disabled (it's a so called 'noscript' site), numerous areas cannot be customized. The impact of 'noscript' is the same for "modern" or "classic" sites. "Modern" sites have 'noscript' enabled by default, meaning that scripting capabilities are not available. However, it is possible and supported to disable 'noscript' settings in both "modern" and "classic" sites to further enable some capabilities.
57
58
58
-
Here are some key areas to take in account when you design your solutions related on the 'noscript' setting:
59
+
Following are some key areas to consider when you design your solutions related to the 'noscript' setting:
59
60
60
61
- Sandbox solutions are not supported
61
-
- Custom JavaScript cannot be enabled in the sites using "classic" extensibility options (e.g. via user custom actions)
62
+
- Custom JavaScript cannot be enabled on the sites by using "classic" extensibility options (for example, via user custom actions)
62
63
- You cannot access sites using SharePoint Designer
63
64
- Some web parts are not available for end users
64
65
- Accessing or updating site property bag entries
65
66
66
-
> **Note:**
67
-
> You can find the full list of impacted capabilities from the [Microsoft Support article](https://support.office.com/en-us/article/Turn-scripting-capabilities-on-or-off-1f2c515f-5d7e-448a-9fd7-835da935584f) under the "Features affected when scripting is disabled" chapter.
67
+
> [!NOTE]
68
+
> You can find the full list of impacted capabilities from the Microsoft Support article[Allow or prevent custom script](https://support.office.com/en-us/article/Allow-or-prevent-custom-script-1f2c515f-5d7e-448a-9fd7-835da935584f?ui=en-US&rs=en-US&ad=US) under the "Features affected when custom script is blocked" section.
68
69
69
-
70
-
### Using PnP Provisioning Engine with "modern" team sites
71
70
<aname="pnpprovisioningengine"> </a>
71
+
### Using PnP Provisioning Engine with "modern" team sites
72
72
73
-
You can use the [PnP Provisioning Engine](https://msdn.microsoft.com/en-us/pnp_articles/pnp-provisioning-engine-and-the-core-library) with "modern" team sites. The PnP Provisioning Engine will automatically detect if a site is a "modern" team site and will adjust its behavior based on the supported capabilities. The process is exactly the same as using the PnP Provisioning Engine with "classic" sites where the scripting capabilities are not disabled.
73
+
You can use the [PnP provisioning engine](https://msdn.microsoft.com/en-us/pnp_articles/pnp-provisioning-engine-and-the-core-library) with "modern" team sites. The PnP provisioning engine automatically detects if a site is a "modern" team site and adjusts its behavior based on the supported capabilities. The process is exactly the same as using the PnP provisioning engine with "classic" sites where the scripting capabilities are not disabled.
74
+
75
+
The following elements are ignored when a remote template is applied to a "modern" team site or a site that has 'noscript' enabled:
74
76
75
-
The following elements are ignored when a remote template is applied to a "modern" team site or a site which has noscript enabled.
76
77
- Site collection AuditLogTrimmingRetention configuration in the auditing settings
77
-
- Apply a custom theme from the template - Current implementation has dependency on storing custom theme to catalog, which is not supported
78
+
- Apply a custom theme from the template; current implementation has a dependency on storing a custom theme to the catalog, which is not supported
78
79
- Form settings for content types
79
80
- Adding custom user actions to site, web, or list level
80
81
- Adding files with file types of ".asmx", ".ascx", ".aspx", ".htc", ".jar", ".master", ".swf", ".xap", ".xsf"
81
-
- Adding files to libraries with the following urls "_catalogs/theme", "style library", "_catalogs/lt", "_catalogs/wp"
82
+
- Adding files to libraries with the following urls `"_catalogs/theme"`, `"style library"`, `"_catalogs/lt"`, `"_catalogs/wp"`
82
83
- Adding web parts to site pages
83
84
- Storing provisioning template information to the property bag of the provisioned site
84
85
- Adding or updating property bag entries to the site property bag
@@ -87,9 +88,8 @@ The following elements are ignored when a remote template is applied to a "moder
87
88
- Site master page settings
88
89
89
90
## Applying custom theme to "modern" team site
90
-
<aname="sectionSection0"> </a>
91
91
92
-
"Modern" team sites support custom themes even though you cannot upload a new gallery entry for end users. This can be achieved by uploading the needed assets to the site and then executing ApplyTheme method. The following PowerShell script shows how to perform this for a "modern" team site.
92
+
"Modern" team sites support custom themes even though you cannot upload a new gallery entry for end users. This can be achieved by uploading the needed assets to the site and then executing the **ApplyTheme** method. The following PowerShell script shows how to perform this for a "modern" team site.
120
123
121
-
> **Note:**
122
-
> - You can use [SharePoint Color Palette Tool](https://www.microsoft.com/en-us/download/details.aspx?id=38182) to create a custom theme file (.spcolor) with the custom color definition. In general, modern team sites try to preserve the feel of the theme by automatically converting classic site theming elements to the modern side. Preserved areas are background image and the following theme slots: ContentAccent1, PageBackground, and BackgroundOverlay.
123
-
> - You can change the logo of "modern" team site by using the Groups Graph API as shown by the SharePoint [PnP UpdateUnifiedGroup method](https://github.com/SharePoint/PnP-Sites-Core/blob/master/Core/OfficeDevPnP.Core/Framework/Graph/UnifiedGroupsUtility.cs#L350)
124
-
> - Applying a custom theme to a modern team site can cause timeouts. The resolution to this is to turn off all available [user interface languages](https://support.office.com/en-us/article/Choose-the-languages-you-want-to-make-available-for-a-site-s-user-interface-16d3a83c-05ab-4b50-8fbb-ff576a3351e8) for the site before applying the theme. Then turn them back on afterwards.
124
+
> [!NOTE]
125
+
> - You can use the [SharePoint Color Palette Tool](https://www.microsoft.com/en-us/download/details.aspx?id=38182) to create a custom theme file (.spcolor) with the custom color definition. In general, modern team sites try to preserve the feel of the theme by automatically converting classic site theming elements to the modern side. Preserved areas are background image and the following theme slots: ContentAccent1, PageBackground, and BackgroundOverlay.
126
+
> - You can change the logo of "modern" team site by using the Groups Graph API as shown by the SharePoint [PnP UpdateUnifiedGroup method](https://github.com/SharePoint/PnP-Sites-Core/blob/master/Core/OfficeDevPnP.Core/Framework/Graph/UnifiedGroupsUtility.cs#L350).
127
+
> - Applying a custom theme to a modern team site can cause timeouts. The resolution for this is to turn off all available [user interface languages](https://support.office.com/en-us/article/Choose-the-languages-you-want-to-make-available-for-a-site-s-user-interface-16d3a83c-05ab-4b50-8fbb-ff576a3351e8) for the site before applying the theme, and turn them back on afterwards.
125
128
126
-
## How to determine if a site is a "modern" team site?
127
-
<aname="sectionSection1"> </a>
129
+
## Determine if a site is a "modern" team site
128
130
129
-
You can detect that a site is a "modern" team site by checking the 'Web.WebTemplate' value of the site. "Modern" team sites are using the "GROUP" template. Since the supported capabilities are the same for a "classic" team site when the scripting is disabled, you should be checking both settings in your code to determine the right behavior or supported capabilities.
131
+
You can detect that a site is a "modern" team site by checking the 'Web.WebTemplate' value of the site. "Modern" team sites use the "GROUP" template. Because the supported capabilities are the same for a "classic" team site when the scripting is disabled, you should be checking both settings in your code to determine the right behavior or supported capabilities.
130
132
131
-
Since there's no direct property to check if the scripting is enabled or not, you can use permissions to determine the current status. When scripting is enabled, there's no AddAndCustomizePages permission in the base permissions of the site.
133
+
Because there's no direct property to check if the scripting is enabled or not, you can use permissions to determine the current status. When scripting is enabled, there's no AddAndCustomizePages permission in the base permissions of the site.
132
134
133
135
```C#
134
136
/// <summary>
@@ -153,13 +155,12 @@ public static bool IsNoScriptSite(Web web)
153
155
}
154
156
```
155
157
156
-
## Additional Considerations
157
-
<aname="sectionSection2"> </a>
158
+
## Additional considerations
158
159
159
-
We'll gradually introduce more customization options for "modern" team sites. These will be aligned with the release of additional SharePoint framework capabilities. Currently there is no exact schedule available, but we'll be updating the "modern" experience articles whenever new capabilities are released.
160
+
We'll gradually introduce more customization options for "modern" team sites that will be aligned with the release of additional SharePoint Framework capabilities. Currently there is no exact schedule available, but we'll update the "modern" experience articles whenever new capabilities are released.
0 commit comments