How to Enable Client Side Theming in SharePoint Office 365

If you are trying to update or modify the color palette for your site's branding using the ShortPoint Theme Builder, and you came across this message below when you click Branding:

Then, this article is for you. The solution is to disable the automatic inheritance of your Site Collection, so you will be able to apply branding or modify colors to your site collection using ShortPoint Theme Builder.

TABLE OF CONTENTS

• Prerequisites
• Step 1: Download and Install latest PnP SharePoint PowerShell
• Step 2:  Add PnP Feature to disable inheritance behavior
• Step 3: Access your site
• Result

Prerequisites

• You are on SharePoint Online enviroment.
• You are a Global Admin in your Office 365 tenancy.
• Make sure that you also have a basic understanding of PowerShell.
• It is also important to read about Execution Policies.

Step 1: Download and Install latest PnP SharePoint PowerShell

Please download SharePointPnPPowershellOnline.msi from https://github.com/SharePoint/PnP-PowerShell/releases.

Note: Please be aware that it might be a different latest version for you depending on when you are reading this article. 

Please install it to have latest PnP SharePoint Modules installed to your machine.

Step 2:  Add PnP Feature to disable inheritance behavior

On your machine, please run the SharePoint Online Management Shell as an Administrator. Then, please follow the step-by-step instructions below how to run the PowerShell command:

Command 1: Connect to your site using the Connect-PnPOnline command. Copy the code below and paste it on PowerShell: 

Connect-PnPOnline -Url <Your site> -UseWebLogin

Where:

<Your site> should be replaced by the URL of the site collection where you want to perform this action. This is the only information that we need to change in this set of commands.

Command 2: Run the following command and ensure that you will get a return value for the ClientSideThemingOptOut: 

Get-PnPFeature -Scope Site -Identity 5138468E-3D76-4F72-9DE4-E029F1245A7B

IMPORTANT: If you see the DisplayName and the DefinitionId displayed after running this command, then it means that you can proceed to the next step. It is our indication that automatic inheritance is not disabled yet.

Command 3: The command below will be used to disable the automatic theme inheritance (ClientSideThemingOptOut). Please copy it and paste as the third line of command:

Disable-PnPFeature -Scope Site -Identity 5138468E-3D76-4F72-9DE4-E029F1245A7B

Command 4: Repeat the command specified in command 2 above. This time, you should not see any return value:

Get-PnPFeature -Scope Site -Identity 5138468E-3D76-4F72-9DE4-E029F1245A7B

NOTE: After running the last command, and you did not get a return value, it means that you have successfully disabled the automatic inheritance to your site, and you may now test your site.

Please note that you can only test the site collection where you have performed this action.

Step 3: Access your site

Once the PowerShell commands have been executed, you may now go back to your site and do a hard refresh (for Windows or Linux operating system: Hold down Ctrl (Control) + Shift and click R, and for Mac operating systehold down Cmd and Shift and then press R). 

Open the ShortPoint Modern Theme Builder (Site contents> ShortPoint Dashboard> Theme Builder> Customize my site) and wait for it to load.

Navigate to Branding:

Result

that's it! You should now be able to set a branding to your site using ShortPoint Theme Builder! 

Related articles:

• Getting Started with ShortPoint Theme Builder - Modern SharePoint Sites (Part 1)
• Getting Started with ShortPoint Theme Builder - Classic SharePoint Sites (Part 1)
• Getting Started with ShortPoint Theme Builder - Modern SharePoint Sites (Part 2)
• Getting Started with ShortPoint Theme Builder - Classic SharePoint Sites (Part 2)