Follow

Changing color theme

Article last updated on the 20th of April 2023.

Please note that this guide is relevant to the Modern UI version of WorkPoint 365 only.

Contents

1. Introduction

2. Requirements

3. Configuration

   3.1 Uploading the WPColor.spcolor file

   3.2 Uploading the bgd_middlegrey.jpg file

   3.3 Rolling out the theme

4. Notes

5. Downloads

1. Introduction

Using a different color scheme from the standard SharePoint scheme it is possible to change the look of text and icons in the Modern UI version of WorkPoint 365.

In this article we will go through how to change the color scheme in WorkPoint.

2. Requirements

There are no license requirements associated with changing the color scheme of WorkPoint 365.

Two files are used in the demonstration of the configuration. These are downloadable in the Downloads section.

3. Configuration

   3.1 Uploading the WPColor.spcolor file

Note that the downloadable WPColor.spcolor file contains information about the colors of your theme. To edit the colors, you need to edit the colors in the file (open the file with notepad or a code editor).

Configuration of the color scheme can be done from the Site Settings page:

  1. On the Home page of the solution, click the Settings button in the top right color.
  2. In the side panel, click "Site information"
  1. In the new panel, click "View all site settings".
  1. In the Site Settings page, under the "Web Designer Galleries" section, click "Themes".
  1. In the Theme Gallery page, click the folder named "15".
  1. Inside the 15-folder, click "Upload".
  1. Click the "Choose Files" button and browse to the WPColor.spcolor file (downloadable in the download section).
  2. Click the "OK" button.

The WPColor file should now show up in the 15-folder file list:

   3.2 Uploading the bgd_middlegrey.jpg file

Uploading the bgd_middlegrey.jpg file can be done from the Site Settings page:

  1. On the Home page of the solution, click the Settings button in the top right color.
  2. In the side panel, click "Site information"
  1. In the new panel, click "View all site settings".
  1. In the Site Settings page, under the "Look and Feel" section, click "Change the look".
  1. Click the "Current" theme.
  1. For the "Colors" drop down menu, select the last color scheme in the list (should look like in the image).
  2. Click the "Change" button below the "Drop an image here" box.
  1. Click the "Choose File" button and browse to the "bgd_middlegrey.jpg" file (downloadable in the download section).
  2. Click the "OK" button.
  1. Click the "Try it out" button.
  1. Click the "Yes, keep it" button.

   3.3 Rolling out the theme

After having made the changes in section 3.1. and 3.2 in this article, the changes to the theme can be rolled out to the solution from the WorkPoint Administration:

  1. Click the "Home" button of the solution.
  2. Click the cog icon to access the WorkPoint Administration.
  1. In the WorkPoint Administration, in the left side menu, click "Layout and Theme".
  1. In the "Layout" page, click "Start theme rollout".

This process may take a while depending on the size of the solution. You will be notified once the process is done.

   3.4. Removing the top bar on new site pages

The top bar can be removed for all new pages using the following PowerShell script:

Connect-PnPOnline -Url xxxxxxxxxxxxxx -Credentials (Get-Credential)

$ListName = "Site Pages"
$PageId = 4
Set-PnPListItem -List $ListName -Identity $PageId -Values @{"PageLayoutType"="Home"}
Click to copy

In the code above, substitute the "xxxxxxxxxxxxxx" line with the URL of the site.

If the site is in danish language, substitute the $ListName value from "Site Pages" to "Webstedssider".

Substitute the $PageId value from 4 to the Id number for the page you wish to remove the header.

4. Notes

Please note that this guide is relevant to the Modern UI version of WorkPoint 365 only.

Have more questions? Submit a request