LATEST HOST REVIEW: SUNNY HQ TURN-KEY WP HOSTING

What are AMP Pages and How to Create One for Your WordPress Site

By    Last updated September 17, 2017   WordPress

This is a guest post by Emin Sinanyan from Amberd Design Studio.

 

The world is busier than ever and keeping up with the needs of your clients has become both easier and more difficult with the introduction of smartphones. They are great for reach, because it is simpler to engage people. However, smartphones do require a different kind of page, one that loads quickly and that is easy for people to read.

 

In fact, according to a recent marketing study, 75% of all respondents stated that they would leave a page if the information doesn’t load quickly.

 

 

AMP to the Rescue

 

Thankfully, there is a solution to slow loading pages on smartphones. Announced in 2015, Google introduced Accelerated Mobile Pages (AMP) and since then many businesses are already jumping on the bandwagon because they work so well. Unlike previous algorithms, this framework has already proven improved loading speed and overall mobile optimization.

 

 

AMP Pages for WordPress

 

 

The bottom line?

 

If you don’t want to worry about losing leads or clients due to slow loading pages, you should strongly consider using Accelerated Mobile Pages with your site.

 

 

How to Incorporate AMP with WordPress

 

If you are already using WordPress, then you likely know that the platform comes with loads of features. The plugin developed by Automattic/WordPress makes it easy to incorporate the AMP framework for your pages.

 

So, before you begin, you will need to go to the Add Plugins Section of WordPress and search for “AMP” Once you find it, go ahead and install it so that you can get started with using it.

 

Note: AMP plugin works best with Yoast SEO tools. Which is a must have plugin!

 

 

AMP Plugin

 

 

Once you have the AMP plugin installed, you simply need to add “/AMP/” to the end of the link, or if you don’t have “pretty permalinks” enabled you would use “?amp=1”. For instance http://example.com/2017/1/4/ would become http://example.com/2017/1/4/amp/ , or http://example.com/2017/1/4/?amp=1 without “pretty permalinks”

 

 

When this is complete you should follow up with:

 

  • Chrome validation process
  • Fetch as a Google tool

 
 

AMP Validation

 

 

Each of these tools will show whether the page is AMP valid, or what issues you need to fix to so that it is.

 

For instance, to use the Chrome validation process, simply use Chrome to go to one of your AMP pages, and add “#development=1” to the end of the URL. Next press Control + Shift + I to open Chrome developer tools, then select Console to see if your page validated, or what problems you may need to fix.

 

 

Chrome developer tools

 

 

While having the WordPress plugin helps, it still requires some work to get running properly. More than likely, you will have to manually validate many of your pages to benefit from AMP.

 

The process of validating your pages can take some time, as you usually need to make some alterations or corrections to your page to ensure that it is valid. Some of the most common changes users had to do were re-specifying the height and width stats for images or replacing old YouTube links that didn’t use http addresses.

 

 

Use Schema Markup and Make Sure It Validates

 

Schema markup is a code that you put on your site to help search engines return more informative results to users and you should make sure that you are using it to your full advantage. Also, Schema Markup is required to make your content eligible to appear in the demo of Google Search news carousel. To learn more about AMP and schema markup click here.

 

Now that we know Schema markup or structured data is required for Accelerated Mobile Pages, lets add it to our site.

 

A great free tool that you can use to add schema markup to your WordPress site is WP SEO Structure Data Schema. After adding the schema markup to your site, use Google’s Structure Data Testing Tool to make sure it validates. If there are any errors, the Google tool will tell you and give you suggestions on how to fix them.

 

For example, in the screenshot below, the Google Structure Data Testing Tool is suggesting that you are missing the a “url” and the “position” field, which is required to validate the schema markup.

 

 

Schema mark up

 

 

Incorporate AMP with Google Analytics

 

Now that your page is AMP valid, it’s time to make it trackable by google analytics. While the WordPress AMP plugin doesn’t do this automatically, it’s easy to enable.

 

To enable Google Analytics to work on your AMP pages, you will need to edit the amp-post-template-actions.php file, either with using FTP (File Transfer Protocol), or the WordPress Dashboard by going to SEO (this is the Yoast plugin), then AMP, then adding this code to Analytics section, click Save Changes.

 

 

Yoast AMP

 

 

After you do this, make sure to change UA-XXXXX-Y to represent your website’s Google Analytics property ID, or else it may mess up your sites tracking, or cause issues with admin permissions.

 

Finally, re-validate, your new AMP pages, and after that you should have AMP and tracking enabled on your WordPress website.

 

 

Check Your Work and View Your Site

 

Remember, these pages are going to make it easier for people to see your page. If you want to tweak it till you get it right and see how it will look on a mobile page, you can always add /AMP/ to the end of your url from the WordPress platform. This allows you to see how your page would look as an Accelerated Mobile Page.

 

 

Get AMPed!

 

There’s no denying that Accelerated Mobile Pages have changed the playing field for digital marketing. If you haven’t jumped on the bandwagon yet, now is the time.

 

 

Emin Sinanyan

Emin is the lead designer at Los Angeles based web design agency Ambed. On his free time, he enjoys blogging, drawing and reading books! Connect with Emin via LinkedIn.

Like What You've Read?

If so, please join our subscribers who receive update from Bitcatcha. We send out exclusive online business tips and tricks. Subscribe now!