How to Implement AMP on WordPress
AMP is an open-source web framework launched by Google in 2016 for building web pages that render almost instantly. AMP uses simplified code, caching on Google’s CDN, and other advantages to serve fast-loading versions of your content in search results. The faster load speeds and improved usability of AMP pages can drive much higher conversions and increased click-through rates.
Implementing AMP requires making specific changes to your web pages’ HTML. Fortunately, setting up Google AMP on your WordPress site if you’re using a compatible theme is fairly straightforward.
In this guide, we’ll walk you through the basics of converting a WordPress blog post to AMP using the official AMP Project WordPress plugin as well as a popular alternative plugin that offers additional options.
Google AMP Official WordPress Plugin
If your theme is not compatible with these plugins, or you need help getting started with AMP on WordPress, please contact us about our AMP development solutions.
The first step for this guide to convert a WordPress blog post to AMP is to download the AMP Project plugin. You can search for it in the WordPress plugin directory or download it directly from the official AMP Project website.
How the plugin works is actually determined by the settings you choose, and there are three basic modes to choose from—Standard, Traditional and Reader:
- Standard mode – uses AMP as the framework so the entire website an be served as AMP and there doesn’t need to be both AMP and non-AMP versions of your posts and pages.
- Traditional mode – posts and pages will have both a canonical URL and a corresponding AMP URL, (for example, the post link appended by /amp) where the AMP version is displayed. In this mode, the entire site can be be served as AMP.
- Reader mode – as with Traditional mode, pages have both a canonical URL and an AMP URL. Only posts/pages can be served as AMP in this mode.
Bear in mind, Google ultimately decides whether to display the AMP or regular version of your post, so it’s very important that you ensure your webpage’s AMP HTML is validated prior to publishing in order for your content to experience the benefits of AMP.
After you’ve uploaded and activated the plugin, access the settings from your plugins page. There you can select the website mode and supported templates (i.e. Posts, Pages, Media, Projects, etc). You can also designate the “Experiences” type (i.e. whether you’re creating an AMP website or AMP Stories). For this guide we’re going to stick with the “Websites” experience and select “Reader” mode with “Pages” and “Posts” templates enabled.
Once you’ve made your selections be sure to save your changes. You can make some edits to the AMP appearance by clicking Appearance > AMP in your WordPress admin. The options for editing the appearance are admittedly limited at the time of this writing.
Note: To check whether the plugin is working and to view the AMP versions of your page, visit the page/post URL with ‘/amp’ appended. For example:
Non-AMP version: https://valleystormweb.com/amp-on-wordpress/
AMP version: https://valleystormweb.com/amp-on-wordpress/amp
If you want to consider an alternative plugin to serve AMP versions of your web pages, another popular WordPress AMP plugin is AMP for WP, which we’ll talk about setting up here.
AMP for WP
Once you’ve uploaded and activated the plugin, a wizard will guide you through the setup process. For this guide, we’re using the Easy/Beginners path.
Depending on the path you select, you will be presented with a different set of options. Here is an example of the general settings screen with the most basic configurations selected.
Once the plugin is activated and the setup is complete, each post and page should contain new AMP settings. You will be able to enter custom content to be used for the AMP versions of your post/page, to toggle showing/hiding the AMP version, preview the AMP version, and more.
Validating AMP Pages
In order for your web pages to be served via AMP, they absolutely must validate as authentic AMP pages. Google ultimately decides whether or not to serve your pages as AMP, and invalid code is a great way to ensure your pages don’t make it.
To check whether your web page uses valid AMP HTML, enter the page URL in Google’s AMP validator tool. There is also a free Chrome extension you can use to validate your content.
Is AMP on WordPress Worth it?
With all of this in mind, it’s important to point out that AMP may not be the best fit for your web strategy. The type and quantity of content you’re serving, your branding approach, how much customization you want, and other factors need to be considered before converting content from WordPress to AMP.
We discuss the pros and cons of switching WordPress content over to AMP in a separate post here.
Custom AMP + WordPress Solutions
Converting your WordPress posts to AMP pages could be a valuable boon to your web strategy. If you’re looking for an agency to help you decide if AMP is the way to go, or if you need help finding custom solutions to convert your WordPress content to AMP, please contact us today. ValleyStormWeb can help you identify the pros and cons of making the switch, and can develop custom solutions tailored to your website and needs.