paint-brush
How to Integrate AMP in WordPress and Display It in Google Searchesby@cloudways
1,268 reads
1,268 reads

How to Integrate AMP in WordPress and Display It in Google Searches

by CloudwaysDecember 20th, 2016
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

Today is the era of speed and readability. You will be left behind if you do not consider these facts. Everyone wants to rank higher in Search Engine Results Page (SERP) and trust me, there are proper guidelines and tweaks that can help you to achieve this. One of them is Accelerated Mobile Pages (AMP), that is quite actually in the buzz these days.

Companies Mentioned

Mention Thumbnail
Mention Thumbnail
featured image - How to Integrate AMP in WordPress and Display It in Google Searches
Cloudways HackerNoon profile picture

Today is the era of speed and readability. You will be left behind if you do not consider these facts. Everyone wants to rank higher in Search Engine Results Page (SERP) and trust me, there are proper guidelines and tweaks that can help you to achieve this. One of them is Accelerated Mobile Pages (AMP), that is quite actually in the buzz these days.

What is AMP?

It is an open source project started by Google back in 2015 to create mobile optimized content that can load instantly anywhere.

Why AMP?

According to Marketingland, most digital growth is now coming from mobile usage. Smart technology, nowadays, represents 65 percent of the digital media time, while the desktop is becoming a “secondary touch point” for an increasing number of digital users.

Google took initiative to provide an optimized content to mobile users, that can load in the fastest way possible. Google also started to boost AMP integrated websites over no-amp sites in Google searches done by a mobile phone.

How AMP Works?

AMP breaks down the structure of your pages in three sections to boost your website:

  • AMP HTML: It is a new redesigned version of HTML with custom AMP commands that removes any extra html element.
  • AMP JS: A redesigned version of JavaScript allows only asynchronous scripts that helps to load JS in a more faster way.
  • AMP CDN: AMP content is cached by Google’s content delivery networks, that helps in delivering the content from cache.

How AMP displayed in Google Searches?

When a visitors searches on Google from a Mobile phone, your AMP page will be displayed. Here is an awesome GIF that represents, how your pages will be displayed in SERP.

Integrate AMP on WordPress

Considering the importance of AMP, Automattic the agency behind WordPress.com took initiative to make AMP compatible with WordPress and released a plugin named as AMP. It can easily be found on WordPress.org repository.

Steps to install the Plugin

There is nothing specifically involved in installing the plugin.

  1. Login to your WordPress Admin Dashboard.
  2. Navigate to Plugins -> Add New. Search for AMP.
  3. Install and activate the plugin.

Yup, you are done!

To test your amp version post, open any post and append “/amp” at the end of the URL.

For example: If you have a URL example.com/post1, your AMP URL should be like example.com/post1/amp

By default, AMP has its own layout to display AMP related posts. But you can customize it a bit by navigating to Appearance -> AMP.

Limitations:

AMP on WordPress has few limitations that needs to be considered.

  1. It works only on posts.
  2. Pages and archives are not currently supported.

Today, I have presented only an overview of AMP and integration on WordPress. There is a bit more depth in it. If you want to know more, here is an awesome article on AMP on WordPress.