Introducing AMP Embedding for Your Cognito Forms!

We’re excited to introduce a new way to embed your forms onto your website: AMP! The new AMP embed option provides completely valid AMP markup for mobile pages. As with the Seamless and Iframe embed options, the AMP embed code is fully responsive to ensure that your form looks great on any device.

What’s AMP?

The Accelerated Mobile Pages Project (AMP) is an open-source initiative to improve the performance of web contents and ads through a publishing technology known as AMP. If you perform a search in Google, you may notice that AMP pages feature a little lightning bolt symbol next to the search listing:

AMP symbol next to search listing.

Limited to the most basic web technologies (including streamlined versions of HTML and CSS), AMP pages can load more quickly on mobile devices than your typical webpage. Additionally, AMP pages provide an enhanced viewing experience; check out the regular version of a webpage in Safari (left) vs. the AMP version (right):

Regular mobile page. AMP mobile page.

The AMP version displays larger text, images, and buttons - far more ideal for smaller screens.

AMP embedding

Cognito Forms AMP embed option. You can access your form’s AMP embed code from the Publish page in the form builder. Just select AMP from the Publish Code tab, then simply copy and paste your embed code into your webpage’s HTML. Plus, make sure to include the ‘amp-iframe’ extension JavaScript in the head section of your HTML document:

<script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>

One thing to keep in mind is that some features (including redirect urls and form prefilling) will not work when embedding your form via the AMP option.

Have any question about AMP embedding, or Cognito Forms in general? Feel free to get in touch with us, or just leave a comment below!