Embed PowerApp Form On SharePoint Page Microsoft PowerApps Webpart

Embed PowerApps Form on Modern Page using Out of the box SharePoint webpart "Microsoft PowerApps".

To know another approach to achieve the same requirement, refer to Embed PowerApps in SharePoint Modern Page.

Microsoft PowerApps webpart features,

  • The Web part automatically signs you into PowerApps.
  • The Web part automatically scales the app to the best fit in the canvas.
  • ability to resize the app using the resizer control.
  • Also works in your SharePoint mobile app.

Note
The SharePoint Site and the PowerApps both should be part of the same Office 365 Tenant to achieve this.

Below are the steps to embed the PowerApps app on the SharePoint Modern page,

  1. Publish the PowerApps form 
  2. Get PowerApps App ID 
  3. Create a SharePoint Modern Page 
  4. Add "Microsoft PowerApps" out of the box webpart
  5. Publish the SharePoint Modern Page

How to get PowerApps App ID

Embed PowerApp form onSharePoint Page Microsoft PowerApps Webpart

  • Clicking on the Details option, you can get your App ID as shown below,

    Embed PowerApp form onSharePoint Page Microsoft PowerApps Webpart

  • Copy this App ID to a notepad.

How to Create a SharePoint Modern Page

  • Go to your SharePoint Online Site
  • Create a SharePoint Modern Site Page

    Embed PowerApp form onSharePoint Page Microsoft PowerApps Webpart

  • Clicking on the "Page", opens a new page. Name the page and add the "Microsoft PowerApps" webpart using the '+' icon.

    Embed PowerApp form onSharePoint Page Microsoft PowerApps Webpart

  • Once the "Microsoft PowerApps" webpart is added, edit the web part and paste the App web link or ID that was copied to notepad.

    Embed PowerApp form onSharePoint Page Microsoft PowerApps Webpart

  • Here you can see, how the PowerApp form is added to Modern SharePoint Page.

Note
We can also use weblink instead of AppID to add the PowerApps form on the page.

How to achieve this with Weblink

  • Copy the web link to a notepad from the details section.

    Embed PowerApp form onSharePoint Page Microsoft PowerApps Webpart

  • Add the "Microsoft PowerApps" webpart to the site page.
  • Paste this weblink in App web link or ID as shown below,

    Embed PowerApp form onSharePoint Page Microsoft PowerApps Webpart

OUTPUT

Embed PowerApp form onSharePoint Page Microsoft PowerApps Webpart

SUMMARY

We discussed how to embed the PowerApps app on the SharePoint Modern Pages using out-of-the-box SharePoint webpart "Microsoft PowerApps". Hope this article helps :)