Modern SharePoint becomes more and more popular. In this tutorial, we would like to show you how easily you can transform a Classic SharePoint Page into a Modern SharePoint Page with the help of our magic Copy-Paste feature.
Before we start:
- Make sure the latest version of ShortPoint SPFx is installed in your environment;
- You are using a valid ShortPoint License;
- You have a Classic Page built with ShortPoint elements that you would like to make modern.
Step 1. Create a blank modern page
In this tutorial, we will create a Modern Site Page in a Modern SharePoint site. The easiest way to do this is to click the cog wheel in the Suite Bar and choose Add a page from the drop down list:
We will go with a simple blank page which will fit our purposes perfectly. Choose Blank and click Create:
You will be redirected to the page interface now. Create a name for your page:
Step 2. Add ShortPoint web part
Click the plus in the center of the page:
Choose ShortPoint from the list of web parts:
Delete the pre-defined section that appears by default: we will not need it this time. Just hover over the top of the section and click the cross:
Here is what it will look like after the section is deleted:
Now, everything is ready for importing your Classic page.
Step 3. Copy the Classic Page
Now, let's open your Classic Page and add ?spcopy=1 in the top address line and press Enter to launch the ShortPoint Copy-Paste bar:
Here is what you will see after the page is refreshed:
Press the blue Copy button to copy the whole page:
Done! Now the contents of the page are copied and ready to be pasted.
Step 4. Paste the copied Classic Page into your newly created Modern Page
Return back to the modern page you prepared in steps 1 and 2. Place the mouse pointer inside the ShortPoint web part as shown below:
Click the right mouse button and choose Paste. Or use CTRL+V (Command + V) shortcut. The copied Classic Page will immediately appear. Click Save as draft to save your new page:
Ready! You can now Publish the page or continue with editing: