How to embed a Microsoft List form in a SharePoint page

If you are looking for a solution to increase the adoption of a new list in SharePoint or Microsoft Lists, getting it embedded in a new page might be a good approach.

By embedding the new item form in a SharePoint page, users will be able to add data to list without leaving the page context, making the process faster and less disruptive.

Embed Microsoft Lists form

To embed the form in a SharePoint page you should to the following:

  1. Open the list in SharePoint or Microsoft Lists as you prefer
  2. Click on New to create a new item
  3. At the top of the new item form click on Copy link
    Embed Microsoft Lists form
  4. Return to the page where you want to Embed the form and add the embed webpart
    Embed Microsoft Lists form
  5. Instead of pasting the URL of the form directly let’s use an iframe tag, doing it this way allows you to control the height of the form in the page. Use the code below and replace the value in the src attribute
    <iframe src="FORM_URL" height="700px" width="100%"></iframe>
  6. Save the page and Publish it

Every user will be able to create new entries to the list using the form that is available in the SharePoint page as the following image illustrates.

Embed Microsoft Lists form

Once a new item gets added to the list, the form redirects the user to the default view; to see the form again in the page the user must click in the new item or reload the page.


4 Responses to “How to embed a Microsoft List form in a SharePoint page”

  1. Matt

    October 9, 2022

    Going back to the default view of the list within the iframe can be confusing for users, and It’s good ux to confirm a submission went through, so we usually redirect them to a confirmation page. Normally that would just require adding ?source=theurltoredirectto, but of course nothing is that straightforward in Sharepoint, so we found one trick to get it to work is to add another parameter like ?web=1 to the redirect url. Something like:
    https://xxx.sharepoint.com/sites/matt-test/Lists/test%20modern%20list/newform.aspx?web=1&Source=https://xxx.sharepoint.com/sites/matt-test/SitePages/test.aspx
    Then just set up a page with a confirmation message. Be nice if Msft would think more thoroughly about common scenarios like this, and do a better job documenting the options.

    Reply
  2. HLJ

    February 25, 2023

    Hey,
    Your iframe is showing a page not found error for your example of how to embed SPO list in SPO page.

    Reply
    • João Ferreira

      February 25, 2023

      Thanks for letting me know I just fixed.

      Have a nice weekend

      Reply

Leave a Reply


I've been working with Microsoft Technologies over the last ten years, mainly focused on creating collaboration and productivity solutions that drive the adoption of Microsoft Modern Workplace.

%d bloggers like this: