The Page Designer for Modern SharePoint product, or V5 Modern, is an offering that sits on top of Modern SharePoint. This brings the design canvas and our suite of tiles into a single part app page model in Modern SharePoint. Ultimately, the LiveTiles Page Designer experience is a page that is conceptually a giant web part.
To begin, navigate to the app catalog within the site collection. From here, upload the LiveTiles Page Designer.sppkg to the app catalog. Once it has been uploaded, there are considerations for deploying to the entire site.
Installation and Custom Scripting
The installation can differ based on whether or not custom scripting is enabled on the site collection. If custom scripting is enabled on the site, the .sppkg will install both V5 Classic and V5 Modern. Otherwise, if custom scripting is not enabled, only V5 Modern will be installed.
Toggle Deploying to Entire Site: On
After the toggle for deploying to the entire site is selected, click on Deploy. The app will deploy. Navigate back to your home page on your Modern site collection.
Toggle Deploying to Entire Site: Off
After the toggle for deploying to the entire site is unchecked, click on deploy. The app will deploy. Navigate back to your home page on your Modern Site Collection. In order to have the app enabled for the site, click on SharePoint Modern's New, then App. From there, you'll be able to search for LiveTiles Page Designer. Once the app is found, add it. After adding the app, LiveTiles Page Designer will now be in the site.
A banner will appear that indicates LiveTiles has been added, but still needs to be installed. Clicking on this banner will lead to a page to install Page Designer.
From the custom scripting section above, installing with custom scripting enabled will perform a full installation, while installing with custom scripting disabled will not install the Apply Permissions to DisplayPages List and LiveTiles Pages items, shown with a plus icon in the installation details.
Using LiveTiles Page Designer
To start using LiveTiles Page Designer on Modern:
Click on New, which will have a drop down appear with options such as List, Document library, Page, etc.
Click on Page.
Once you’ve clicked on Page, you’ll be presented an option to select Templates or Apps.
Click on Apps, and then under Featured, click LiveTiles Page.
A preview will appear on the right (but it can sometimes be a bit slow to show). Click on Create page at the bottom right.
Once the page has been created, you’ll be taken to a screen where the designer can be opened.
If you are an existing V4/V5 Classic user that has just deployed Page Designer, it is recommended to enter the installer and run it once.
Otherwise, enter a page title, and then under Actions, select Open Page Designer.
Once the Designer loads, rows can be dragged to the canvas or the plus button can be clicked to add a row.
From here, more rows can be added, make changes to the row layout, add tiles to rows, or manage certain options in the top right by clicking the ellipsis.
Once a page has been created, click Done in the top right.
Once Done has been clicked, the page view will become present.
From here, click Save to complete any changes, and the page is an interactive end user view now.
To modify the page again, click Edit to bring out the slide panel with the Designer options.