Official AMP for WordPress plugin and Validating Your Site – AMP on WordPress (part 3)

In this final part of our series on AMP in WordPress, we’ll be looking at how to use the official ‘AMP for WordPress’ plugin, and wrapping it all up with a guide on validating your shiny new AMP site.

The ‘AMP for WordPress’ Official Plugin

To get started: search, locate, install and activate the ‘AMP for WordPress‘ plugin from your dashboard. Do make sure that it is the official plugin.

Once this is done, under ‘Appearance’, in the ‘AMP’ tab, select the ‘Design’ tab on the AMP customizer page. Now, like with the previous plugin, you can really tweak the look and feel of your AMP site, so feel free to pick your colors, and find ‘Publish’ at the top to finish things off.

Under ‘AMP’, then ‘General’, you can locate ‘Post Type Support’ and choose whether you want to display either posts or pages (or everything) in your AMP site, then hit ‘Save Changes’.

Now because this the official plugin, you won’t get as many options to really fine-tune your AMP experience, but hey that’s why you have the world of plugins on WordPress – such as the Glue plugin to add the deservedly well-known Yoast SEO plugin into the AMP site.

For this, you’ll have to locate, install and activate Yoast SEO, and then repeat this process with the ‘Glue for Yoast’ plugin as well. You can now find ‘SEO’ under ‘AMP’ in the dashboard, and then select all the content you want to enable AMP for. ‘Save Changes’ saves your choices, and you can go ahead to the ‘Design’ tab and choose an icon for the AMP site, set a color scheme, or tweak the custom CSS.

The ‘Accelerated Mobile Pages’ plugin we discussed last time has way more customization and options than this official plugin, but if all you want is the basics of AMP for your WordPress site, you’d be better off using this one.

Validating the New AMP site

We promise, this is ALL you need to do, and your AMP site will be ready for primetime. Basically, validating means ensuring that all the platforms that are supported by AMP can access and link to your AMP site. This will also help with troubleshooting any potential errors with your AMP. There are a couple of methods for this:

1. Method 1 – Developer Tools in the Browser

Add #development=1 at the end of your AMP URL and open the page in any mainstream browser of your choice, such as Chrome. Next, open the dev tools console for the browser – in the case of Chrome, it would be ‘Chrome Devtools’. Here, any errors in your page will show up in red, and they’ll be accompanied by a description of the probable cause of the error.

Usually, these errors can be due to problems with prefixes, formatting, tags or code, and most of the time, the error display will show you a way to resolve the error as well. On the off chance that there is no instant fix, you’ll find help at the AMP project page to deal with the common kinds of validation errors.

2. Method 2 – AMP Validator extension

Be forewarned, this extension is available only for Google Chrome and Opera. Using this tool, you get a straightforward overlay that lists errors and probable causes, much like the DevTools console. It even has the neat feature of redirecting you to the AMP page if you run it on the non-AMP version of that page.

With that done, you’ve finally got your AMP site ready to make life easier for your mobile visitors and improve your search engine visibility and even the eyeballs and virtual footfalls that your site gets – all because you decided to create a lightning-fast AMP version of your site. And if all this seems just a tiny bit intimidating or just plain distracting from your packed schedule, you could let the team here at Vipe Studio step in for you and get your AMP site done just the way you need it.

We’ll see you soon with more information from the world of WordPress!

More on The Topic

• Building a Secure WordPress Ecosystem for Enterprise Applications
• Maximizing WordPress Site Performance with Advanced Optimization Techniques
• Creating Compelling Narratives with WordPress Storytelling Features
• Next-Gen WordPress: Trends in Custom Development for Future-Ready Websites
• Scaling WordPress for Enterprise: Overcoming Common Challenges

The content of this website is copyrighted and protected by Creative Commons 4.0.