How to Implement Google AMP For Your WordPress Site? [2024]

Since the internet is always evolving, you need to constantly adapt to all the changes to stay at the top. If you don’t, you will be left behind. It has already been a year since Google announced AMP; it’s contribution towards mobile web browsing. With the increase in mobile web browsing, it’ll be a wise choice to implement Google AMP in your WordPress site.

Also read: Google Sites vs WordPress | Easy Comparison [2024]

What is Google AMP

Accelerated Mobile Pages Project was first announced back in October 2015. This initiative was first taken by big tech companies like Google and Twitter. The target of this initiative was to make the websites load faster for mobile devices. It consists of AMP HTML, AMP JS library and Google AMP Cache. Accelerated Mobile Pages or AMP uses less HTML and JavaScript. This allows the content to be hosted on Google AMP Cache.

Google then serve this cached version to users instantly when they click on the link in their search results. It is an open framework that allows you to develop light web pages. It is an open-source project for improving the performance of web content for mobile devices.

Since more than 48% of the devices browsing the Web are mobile devices, using Google AMP can help increase your site’s traffic and ultimately increase the revenue. It is a barebone version of heavyweight web pages. Fast loading sites offer a better user experience and can improve your traffic. In a research, it was found that at least 30% of the users leave the site if it doesn’t load within 3 seconds. AMP reduces this while improving the performance of mobile websites.

The Good Side

• It is completely opensource and free.
• It increases the site’s load time.
• It focuses on recommended performances practices like the prohibition of big CSS and JS frameworks.
• Increases the mobile ranking.
• May impact conversions.
• Improves the server performance
• Better automatic image optimization
• Optimization in slow connection and site’s size.

The bad side

• Isn’t currently a ranking factor.
• Could be difficult to use and test for non-developers.
• Ad revenue may be reduced.
• May impact conversions in a bad way.
• Some reports indicate higher bounce rates.
• Doesn’t support older browsers.
• Limited widgets and features

How to implement Google AMP in your WordPress Site?

Now that you know about Google AMP and how it is good or bad, let’s take a look at how you can implement it on your WordPress site.

Step 1: Installing AMP Plugin

Enabling Google AMP for your WordPress site is easy. The foremost thing you need to do is install the AMP Plugin. This plugin is released by Automatic, one of the official partners for AMP Project. This plugin supports posts only. It will not affect the pages.

Login to your WordPress Dashboard using the Admin credentials used to set up your WordPress website. From the left side menu, Hover over Plugins and Click Add New. Search for the keyword AMP Plugin and install the plugin. Activate the Plugin after the installation is complete.

You can now access the AMP plugin from the left side menu from the WordPress Dashboard.

You can customize the AMP version of your website according to your needs. You can choose the header background and the font color on the page. You can also add a logo or favicon to your AMP site. Click the Save button to keep your changes.

The plugin will dynamically generate AMP versions of your sites which can be accessed by putting /amp/ at the end of the URL. For example, if the post URL is http://example.com/post/, then you can simply put /amp/ at the end like http://example.com/post/amp/ to access the AMP version of the site. This will show you a stripped-down AMP version of the same post.

If you view the source code for this AMP site, you will find the following code in your HTML.

<link rel="amphtml" href="http://example.com/post/amp/" />

The above line requests the search engines and other services where to look for the AMP version of this website.

You can sometimes get a 404-error page after installing and activating the AMP version of your site. This may be due to the old permalink structure that was set up during the installation of your WordPress site. You can simply fix this from the Dashboard page. Click on Settings menu and Click on Permalinks & Click on Save changes. It will refresh the website’s permalink structure.

Step 2: Adding Google Analytics

You need to add Google Analytics to your AMP pages to track the visits. This can be a bit difficult as you’d have to modify the Google Analytics tracking code manually. If a user visits an AMP site and the normal site, Google Analytics counts this as two different sessions. This can be fixed by installing Monster Insights. This is the plugin that allows you to add Google Analytics to your AMP sites properly. All you need is to install the Monster Insights plugin and activate Google AMP addon. For step-by-step instructions, follow the steps below:

1. Under Monster Insights Google AMP Addon, go to Insights -> Add-ons and then click on Install.
   
2. After it has been installed, the button will change to Activate.
   
3. Click on the Activate button. The status located on the bottom right should change from inactive to active.
4. You have successfully installed and enabled Google AMP addon on Monster Insights.

Step 3: Fixing SEO Issues

You’ll only get the basic AMP template after using AMP Plugin. You’ll need to customize the AMP pages if you want to make your site unique. A standard meta tag will be added in the head to tell Google or any other AMP handlers that an AMP version of the page is available.

But, if you’re using SEO plugin like Yoast, the default metadata of AMP plugin is not favorable. You may want to use Glue for Yoast SEO and AMP for fixing SEO issues on your AMP pages.

To using the plugin, install Glue for Yoast SEO and AMP -> go to SEO -> AMP -> Design. Make the customizations you want.

It is recommended that you do not add any AMP-specific tracking code. It may interfere with the tracking of AMP pages.

This is it. If you have followed us this far, you have a successful implementation of Google AMP in your WordPress site. To check whether your code validates or not you can go the Google AMP Validator tool and test your site. It will give the result whether your site has passed or failed the validator test. You can also use a Chrome extension to validate the page if you are on a chrome browser.