An AMP (Accelerated Mobile Page) is designed for campaigns targeted primarily at mobile users, which helps you keep your visitors’ attention with loading times of under one second.
In order to create a new AMP page, click on Create New Page, then select AMP Landing Page.
Now you can start building your page. On an AMP page, you can add all the elements available for a regular page, as long as you stay within the allowed file size.
Please note that any HTML used on AMP pages has to be specifically tailored to work on AMP pages since they are structurally different from regular pages. The code can come only from the AMP component library that can be found here: https://d.pr/aVGDOp.
You can run an experiment (A/B test) on an AMP page just like you would on a standard page. You can check out our article for more information on running experiments here: https://d.pr/lzEvl8.
Just like in the case of our regular pages, you will need to add all the elements you want to the desktop version, in order to be able to arrange and resize them on the mobile version, even if the desktop version will never be displayed on the live URL.
How to create an AMP from a standard page
If you are building the AMP version of an already created standard landing page, you can save the Instablocks on that page and then just insert them in the same order on the AMP page, to save time. You will then need to arrange the look of the mobile page, which is the only one that will be displayed in the case of an AMP. Note that this is for design only; conversion goals, integrations, etc. need to be set up individually. They do not transfer over from the standard page.
Note: While you’re designing your page, you may see a warning telling you that you’re approaching the CSS file size limit. AMP pages have a 75 KB size limit for the CSS file, so there’s a cap to the number of objects you can add. The size limit applies to the entire page/experience, meaning that if you have variations created within an Experiment, the total size of all of the variations combined will have to be under 75 KB.
If there’s a good chance you’ve met or exceeded the file size, you’ll be asked to validate. Click “Validate” to check.
If you added custom code to your AMP you will need to validate it to make sure it is compliant with the structure of the AMP (the code must come only from the AMP component library. ). To do this, you can click the button situated below the left sidebar:
Publishing an AMP Page
Once you’re happy with how your page looks, you will have to publish it. AMP Pages can be published on custom domains through a CNAME record as seen here: https://d.pr/D4d0eJ or through our WordPress plugin as mentioned in our article here: https://d.pr/1eUSLW.
Click the Publish Experience button from the slide-out menu for your AMP page and select the desired publishing option. This prompts you to set up the publishing of the page. Clicking Publish will trigger the validation process (checking if the page is AMP compliant). If your page passes the validation process, it will be published.
You can also publish your AMP Page on WordPress by following the instructions provided in this article: https://d.pr/1eUSLW.
Note: You can publish an AMP Page and use it as the mobile version (on search engine results) for a fully-featured standard page. Instructions on now to link an AMP mobile page to a standard landing page can be accessed here: https://d.pr/qxNxf9.
Adding Javascript to an AMP
If you need to add Javascript to an AMP, you can do so, as long as the script comes from the AMP component library.
You can add it in an HTML box in the page editor, in the HTML/CSS section, or in the Scripts & Privacy section in the slideout menu.
NOTE: Heatmaps are not available for AMP landing pages.