- 16 October, 2018
- Posted by: DurleyPS
- Category: Website Optimization
AMP an opensource project supported by Google that has appeared a few years ago and now Google has implemented in their search results, let’s see what it is, how it works and how to implement and configure it in WordPress CORRECTLY.
What is AMP – Accelerated Mobile Pages?
AMP stands for Accelerated Mobile Pages, is a project that tries to adapt the Internet and the format of content to what is currently what the Internet user most demands: a smooth and efficient navigation from the smartphone or tablet.
In order to understand what AMP is, it is first necessary to know some important concepts:
- Navigation from mobile devices is increasing in a “scary” way in the last two years, we talk about that currently there are websites with almost 90% of traffic from mobile devices.
- Although smartphones and tablets use data rates that are not as fast (usually) as cable or ADSL Internet connections, for the user / visitor / customer, the rules of the game remain the same, ie the user does not stay waiting to be loaded pages.
For these reasons, Google began to support the AMP project with the aim of creating a content publishing format for online media. In addition, Google also has a way of displaying AMP version websites in search results, i.e. content with AMP version:
As is common in many opensource projects supported by Google, the development is hosted in GitHub: https://github.com/ampproject
We are not going to go into what is the markup language and AMP HTML tags themselves, because in our case (in this article) we will make the implementation and configuration in WordPress using a free plugin.
What AMP is not?
One thing that needs to be made very clear is that AMP is not a system for creating a mobile version of your website, that is, it does not replace the responsive version of a website.
AMP is created for content websites such as news portals, blogs or online newspapers, sites where users continually enter to see new content published continuously and periodically.
If you have a static website such as a corporate website, AMP is not your solution unless you have a blog that you update continuously.
Configure AMP in WordPress.
To set up AMP on your site, you will need an AMP plugin for WordPress. Before proceeding, we recommend that you back up your WordPress site. Once you’ve done that, you’re ready to get started.
In addition to providing an elegant and user-friendly interface for beginners to set up their pages, the AMP for WordPress plugin can be integrated with many additional tools. These include WooCommerce (the leading e-commerce plugin for WordPress), Alexa metrics, OneSignal push button notifications and more.
To use this plugin first go to Plugins > Add New to your desktop. Search for ‘AMP for WP‘ download and install the plugin.
Then go to the new AMP tab on your WordPress board. You will see a drop-down menu with sections for Settings, Design, Extensions, etc. Let’s take a closer look at the Settings option:
After configuring the basic elements, you can run the different AMP options for WP, which include:
- SEO: This includes setting up meta descriptions, integration with SEO plugins, etc.
- Performance: There is a unique configuration to enable and disable file minification. Minimizing can further improve the speed of your site.
- Analytics: Here you can configure the integration with Google Tag Manager, as well as the analytics options.
- Comments: This allows you to configure if you want to include WordPress, Disqus and/or Facebook comments in your AMP for WordPress.
- Advanced Settings: You can enter custom HTML for headers and footers, set up mobile redirection and enable or disable retina images.
Be sure to click Save Changes for each of the above settings once you have configured them. After that, select the Design tab:
Basically, this is where you can customize the look and feel of your WordPress AMP site.
To do this, you can choose a dedicated AMP theme from those listed in the Theme Selector drop-down menu. After choosing a theme, you can customize the look and feel.
You’ll find design settings for color schemes and typography (listed in the Global tab), header and footer display options, homepage sidebar options, and more. In the Social section, you can also select which social networking buttons you want to display on your AMP site for WordPress.
Once you are satisfied with the look and feel of your AMP site, you can save the changes. You can also get a preview by simply going to Appearance > AMP:
The free version of AMP for WP contains a wide variety of features. However, you can significantly improve the look and functionality of your AMP site with premium extensions. There are extensions to implement star ratings (which are perfect for real estate products or profiles), integration with AMP WooCommerce Pro, use of custom publication types and more:
It is also possible to buy Premium AMP themes. You can see them by going to Design > Themes on your desktop. There are options that are specifically tailored to particular types of websites, such as news sites, magazines, etc. In addition, there are some remarkable multipurpose themes:
If you want to enjoy even more advanced features, there are several Pro plans available for this plugin.
After you have configured some of the AMP plugins for WordPress, there is one more step to follow. You will need to validate your AMP for WordPress to ensure that compatible platforms can be accessed and linked. Validation is also a practical way to get a reading of AMP errors in order to resolve them.
A very effective method of AMP validation is to use the AMP Validator extension for Google Chrome and Opera:
This tool provides a simple display of errors (red icons) as well as their causes. In addition, if you are running AMP Validator on a non-AMP page, a blue extension icon will appear linking you to the AMP version of that page. This feature presents a useful way to evaluate elements of your site’s theme that may prevent AMP for WordPress from displaying correctly.
Even a few seconds of delay during loading could significantly reduce your site’s positioning (and conversion rates) in search engines. Fortunately, as we’ve seen, using Google AMP can help you ensure that your site’s pages load at lightning speed on mobile devices. In addition, setting up and customizing AMP for WordPress is simple and straightforward, as long as you use the WordPress plugin for accelerated mobile pages.