How to change the HeaderLayoutType to ColorBlock in an existing modern page in SP Online?

Question

If I have an existing page in the site pages library. How can I change the headerlayout type to colorblock? It seems I can specify that when making the page through pnp provisioning or

https://docs.microsoft.com/en-us/powershell/module/sharepoint-pnp/add-pnpclientsidepage?view=sharepoint-ps

But for an existing page, there doesn't seem to be a command.

https://docs.microsoft.com/en-us/powershell/module/sharepoint-pnp/set-pnpclientsidepage?view=sharepoint-ps

Does anyone know?

Answer 1

You can achieve this in SPFx Web Part. `const file = await sp.web.getFileByServerRelativeUrl(this.newPageServerRelativeURL);

                    const page = await ClientsidePageFromFile(file);
                    
                    page["json"].CanvasContent1 = "<div></ div>";
                    page["json"].PageLayoutType = "Article";
                    page["json"].BannerImageUrl = "/_layouts/15/images/sitepagethumbnail.png";
                    page["json"].PromotedState = 0;
                    page["_layoutPart"].properties["authors"] = this._Authors;
                    page["_layoutPart"].properties["layoutType"] = "FullWidthImage";//"ColorBlock";//"NoImage";
                    await page.save();`

Answer 2

You do not need to set the SharePoint modern page Header Layouts to the Color block layout by using PowerShell command.

SharePoint Online meets your needs with out-of-the-box UI design.

Please follow steps:

1.Create new page.

When the mouse hovers over the Title area, click on Edit web part button. Here are a variety of Layout options for you.

2.Click the Colorblock option and publish your page.