Watch Video

Steps

  1. Go to your Microsoft Form
  2. Click on Collect Responses at top right
  3. Click on the code icon (</>)
  4. Copy the code
  5. On your WordPress webpage, insert a Custom HTML block
  6. Paste the code into the block
  7. Change the width to 100% and height to some reasonable number like 700px

Code Example of Microsoft Form

<iframe width="100%" height="900px" src="https://forms.office.com/Pages/ResponsePage.aspx?id=gwDJdMYDOkWAHJJRzdF-uEwrjqoTEuJMj3MXvQdkxMhUMzNTTDZXVUNVQjZZOUw5MVJNMU9FNjE1MS4u&embed=true" frameborder="0" marginwidth="0" marginheight="0" style="border: none; max-width:100%; max-height:100vh" allowfullscreen webkitallowfullscreen mozallowfullscreen msallowfullscreen> </iframe>

What the Embedded Form Looks Like

Useful Tips

  1. Under Collect responses, double-check the form settings. Make sure it is open to the desired users.

    Screenshot of form settings
  2. Check the published page on a phone to see if it displays correctly.
Back to top