Accelerated Mobile Pages (Google AMP) Hack to Add Lead Capture Forms

I’ve been working a lot with Google’s Accelerated Mobile Pages (AMP) Project as of late. The platform has a lot of restriction and doesn’t permit things such as third-party JavaScript and html form tags (so, lead-capture forms aren’t supposed to be possible within the AMP framework), but there is a weird workaround…

iframes ARE supported within amp-html, and they can include third party JavaScripts, form tags (useful for lead capture or a comment system like Disqus), and even produce pop-ups.

To do this, you need to add the amp-iframe extended component to your <head>:

And then add an amp-iframe tag in your body. It must be at least 600px or 75% of the first viewport away from the top. The URL in the iframe has to be an https url and must not be on the same domain (or at least subdomain).

In order to add some magic and enable things such as pop-up functionality, you will have to add some values to the sandbox attribute of amp-iframe.

For example:

You may want to add sandbox="allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-forms".

This would allow you to include lead capture forms and pop-ups to your amp-html page.

Coming Soon…

Update 10/31/2016

Forms are now supported using the amp-form extension. Like other AMP extensions, you will need to include another JavaScript file in the head of your AMP page: <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>. For more information, reference the documentation

It’s a really useful tip! I think as a non-tech guy I started to understand the technical side of AMP. I did research on this topic and put together a detailed guide on Google AMP. I also used this article as a resource (check it out here: http://blog.momentum.ai/google-accelerated-mobile-pages)

Honestly, I didn’t fall in love with AMP, because I don’t want to say goodbye to my tracking tools. Even it’s the price of speed.

What if AMP is being used for a website that takes in sensitive information over forms? Say the Banking/Finance/Medical businesses?
Will this information go to Google servers before it goes to the company, since AMP will be cached?

Thank you, Paul.
Yes, tracking the click on the submit button is what I did for the moment, but it is not the same a click on the button as a submit. For example, if the user clicks twice and the form is not validated and really it is not sent…
I suppose there is no a better solution.