Paperform logo
ProductTemplatesPricingResources
ProductTemplatesPricingResources
Sign inTry Free

How do I embed my form with AMP?

Help Results & Sharing Embedding

Embedding

Can I add a form as a popup on my site?Can I change my form's width when embedding it as a popup?Can I embed a form without the background?Can I embed a payment form in a non-SSL page?Can I embed my form in an email?Can I speed up my embedded form's load time?What is oEmbed and how can I use it with Paperform?Embedded form JS API (draft)How can I embed my form in a React app?How do I embed a Paperform form in Webflow?How do I embed my form with AMP?How do I use the iFrame fallback method for embedding?How do I embed a Paperform form to Squarespace?Is the form mobile-friendly when it is embedded?My dropdown question is cut off when embedded. How can I fix it?Why doesn't my embedded form work?Embedding Guide

Once your form is ready to embed and you have your AMP page setup, you can follow the following steps to embed your form.

Note: Currently, AMP requires you to use a custom amp-iframe element. This means that you may only embed a form using the fallback iframe embed method.

Embedding your form

  • Paste the code snippet below into your AMP page just before the end of the body. This script is required by AMP to make the 'amp-iframe' component work.
<script  
  async  
  custom-element="amp-iframe"  
  src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"
>
</script>
  • Paste the code snippet below into your AMP page where you would like your form to be embedded. You need to update the FORM_URL placeholder with your actual form's URL. You can find this in the Editor under the Share → Social & URL menu.
<amp-iframe  
  width="1000"  
  height="1000"  
  sandbox="allow-scripts allow-same-origin"  
  layout="responsive"  
  frameborder="0"  
  src="FORM_URL/embed=1&inline=1"  
>  
</amp-iframe>

Gotchas

There are a few requirements from AMP that must be considered:

  • The iframe will not load if it is within 600px or 75vh of the top of the window when the page is loaded. You need to position the iframe at least that far down.
  • If the page is refreshed while the iframe is within 600px or 75vh of the top of the window then the iframe will fail to load. There is nothing you can do to avoid this, it is a limitation of an AMP iframe.
  • PayPal is not currently supported in AMP pages so forms with PayPal connected cannot be embedded successfully in AMP pages.