Step-By-Step Guide to Implementing AMP on WordPress
In this article, we explain how you can prepare your WordPress website for AMP (Accelerated Mobile Pages). First, we explain what AMP is and what the pros and cons of AMP are. Next, we explain which plugins you can prepare your WordPress website for AMP and what you need to look out for.
What is AMP (Accelerated Mobile Pages) exactly?
AMP stands for ‘Accelerated Mobile Pages’ and is a collection of techniques with the aim of loading your web pages on mobile devices at lightning speed. Many large internet companies (such as Google and Twitter) have embraced this technique and are encouraging its use through the ‘ AMP Project ‘.
More specifically, web pages are made faster by removing them from all kinds of frills that are not necessarily needed on mobile devices. This makes a webpage very compact and quick to load. Companies such as Google and Twitter index AMP pages and make copies of them, enabling them to quickly provide their visitors with an AMP page. And that loading speed is good for the conversion of your website
Besides the speed gain, you also have the advantage of better ranking in search engines. For example, Google shows the AMP messages highlighted in the search results on mobile and often also a bit higher than other search results. In addition, it is no secret that Google is placing more and more value on websites that work well, quickly and intuitively on mobile devices. That value translates into better ranking in the search engines.
But it is good to be aware of possible disadvantages associated with AMP. First of all, it is important to realize that your webpage with AMP is very ‘stripped’. This means that all kinds of design elements on your website may no longer be visible or unobtrusive than you would like. Compare it to printing a web page; then often also disappears everything that is not necessarily needed on paper.
In addition, all kinds of functionalities are often switched off. Do you have ads on your website, for example? Make sure that these have to be reintegrated into your AMP pages because standard ads do not just work. The same applies to track scripts or statistics software such as Google Analytics; this requires additional actions. Also, pop-ups (such as cookie bars and newsletter pop-ups) will not show on your AMP page. So if you want to keep your conversion up to standard, then you have to think about it again in your AMP pages.
And that brings us to the third disadvantage: manageability. With the addition of AMP pages, you have actually created an AMP version for every page in your WordPress website that you probably also want to check. That, therefore, takes more time than when you only need to check your ‘normal’ web pages.
You may find the following disadvantage a bit exaggerated, but it is often criticized by the AMP initiative so we would like to mention it. The criticism is that online services such as Twitter and Google store a copy of your web pages locally to serve them quickly to their visitors. If you go beyond that though, it could eventually become a possible threat to the internet as we know it today; your AMP website will then be hosted by the large software companies and that will make you dependent on those organizations. For some people, it is in any case reason enough not to equip their website with AMP.
Install AMP on your WordPress website
To install AMP on your WordPress website you have several (free) plugins at your disposal. We discuss them below one by one and explain what you need to look out for when configuring them.
For simple WordPress websites the plugin ‘AMP for WordPress’ is a good plugin. It is easy to install and easy to use. For example when you have a website with Google Analytics, but otherwise not too many extras. Go to Plugins -> New plugin in your WordPress website and search for ‘AMP for WordPress’ in the top right corner. Then click on ‘Install’ and then ‘Activate’.
At the bottom of your WordPress admin menu, you will now see an ‘AMP’ button. Move your mouse over it and click on ‘General’. Here you will see an overview of the pages, messages and other post types of which you can indicate whether they should also be generated as an AMP version. In most cases, you choose news items, blog items, etc., but you may also want to show your standard pages in AMP. You may also have extra post types on your website. You can also tick it here. Then click on ‘Save changes’.
You can now check whether AMP works by going to a news item in your website and tapping the URL / amp / in the address bar. If all goes well, you will see the AMP version of your website. Does this not work? In the WordPress admin menu, go to ‘Settings’ -> ‘Permalinks’ and click on ‘Save changes’ below. Then the URLs of your WordPress website will be rebuilt.
Google Analytics in AMP for WordPress
Because most plugins of your WordPress website will not be active in your AMP pages, you will have to manually set up Google Analytics for AMP. Otherwise, the statistics of the AMP visitors are missing in your search results.
Go to ‘AMP’ -> ‘Analytics’ in your WordPress admin menu. Enter ‘Google Analytics’ by type and paste the following code under ‘JSON Configuration’:
Replace UA-XXXXX-Y with your Google Analytics Tracking ID (located under https://analytics.google.com -> Management -> Property Settings) and click on ‘Save’. ‘ID’ is now also filled in for ‘Type’. Your Google Analytics tracking is thus active.
Do you also use the plug-in ‘Yoast SEO’ on your WordPress website? Install and activate the plug-in ‘Glue for Yoast SEO & AMP’. This plugin ensures that meta fields that you have set up with Yoast SEO are also well configured in your AMP pages. Moreover, this plug-in gives you the possibility to make some extra layout adjustments to your AMP pages.
Go to Plugins -> New plugin in your WordPress admin menu and search for ‘Glue for Yoast SEO & AMP’ in the top right corner. Then click on ‘Install’ and then ‘Activate’. Then go to ‘SEO’ -> ‘AMP’ in your admin menu and click on the ‘Design’ tab. There you can change logos and colours of your AMP pages.
Advanced: AMP for WP
In the manual above we have described how you can activate AMP for your WordPress website. Do you want a lot more control over your AMP pages? Do not use the above WordPress plugins, but install and activate the plugin ‘AMP for WP – Accelerated Mobile Pages’. This plugin offers more support for the integration with other plugins and also gives you more choice for different designs.
Go to the WordPress admin. After activating click on ‘Run installation wizard’ and follow the steps to configure the basis of the plugin. Finally, click on “Let’s go” and you will enter an advanced panel where you have many options to configure your website. Think of links with contact forms, e-mail opt-in, Adsense, AVG compatibility, etc. Note: setting up this plug-in is really for advanced users. The additional features that this plugin offers to ensure that you have additional management tasks to check if your AMP pages are doing well.