Single part app pages provide the capability to host SharePoint Framework web parts or Teams applications in SharePoint Online with a locked layout.
Pros:
Cons:
To deploy the Single Web Part App Page in your tenant follow the next steps:
Install PowerShell Gallery
Open PowerShell as Administrator & run the following command
Update Page Template
Change the "About-Us.aspx" to the name of the page you want to update
Before
After
Happy Coding...
Pros:
- Single Part App Pages cannot be edited by end-users using a browser
- It will take the entire width & Header banner area
Cons:
- Currently supports hosting only a single web part or Microsoft Teams application
- Developers can change page layout programmatically from normal page layout to a Single Page App Page
To deploy the Single Web Part App Page in your tenant follow the next steps:
Install PowerShell Gallery
Open PowerShell as Administrator & run the following command
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Install-Module -Name SharePointPnPPowerShellOnline |
Update Page Template
Change the "About-Us.aspx" to the name of the page you want to update
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$SiteURL = ## Your SharePoint site Url ## | |
Connect-PnPOnline -Url $SiteURL | |
$item = Get-PnPListItem -List "Site Pages" -Query "<View><Query><Where><Eq><FieldRef Name='FileLeafRef' /><Value Type='Text'>About-Us.aspx</Value></Eq></Where></Query></View>" | |
## Convert the page layout type to SingleWebPartPage | |
$item["PageLayoutType"] = "SingleWebPartAppPage" | |
## Revert the page layout type to Article | |
## $item["PageLayoutType"] = "Article" | |
$item.Update() | |
Invoke-PnPQuery |
Before
After
Happy Coding...
Comments
Post a Comment