If you’re using AMP pages (Accelerated Mobile Pages) and CloudFlare on your WordPress website/blog you’ve probably noticed some validation errors. This guide assumes you have the WordPress AMP plugin installed.
To fix the validation errors go to Page Rules on the CloudFlare dashboard and add a rule for your website. Use the following url pattern:
*thewirelessguy.co.uk/*/amp/*
Obviously replace thewirelessguy.co.uk with your own website domain.
Then use the following settings:
Disable Apps
Disable Performance
Keep SSL Full set as ON as you’ll need that keep the AMP pages using https.
If you are using the CloudFlare plugin (or a plugin such as WP Rocket) go to the plugin settings page and make sure HTTPS Protocol Rewriting is set to off. The reason for this is because AMP doesn’t allow any other URL format but https:// in script tags, for example:
<script src=”https://cdn.ampproject.org/v0.js” async=””></script>
Setting it to ON results in the following which doesn’t validate:
<script src=”//cdn.ampproject.org/v0.js” async=””></script>
The above rules can be adapted for any Content Management System (CMS) that uses CloudFlare.
There are AMP validator extensions available for Chrome and Opera. They automatically validate each AMP page visited and give a visual indication of the validity of the AMP page as a coloured icon.