Accelerated mobile pages (AMP) have completely changed the way publishers go about fine-tuning the mobile user’s experience. While AMP isn’t really anything new (it’s been around since 2015), leveraging its framework to build mobile-friendly pages still takes quite a bit of technical know-how and effort.
This is especially true if you’re still figuring out WordPress as the AMP setup there also takes some practice. So, how exactly do you go about implementing Google’s AMP on your WordPress CMS effectively?
Consider this your crash course. Keep reading to learn all the AMP-to-WordPress steps.
Step #1: Install an AMP WordPress Plugin
The simplest way to get Google AMP set up on your WordPress website is by going straight to plugins. The two most common Google AMP plugins include AMP and AMP for WP – Accelerated Mobile Pages.
Here’s how to use each one:
AMP
The AMP plugin is the official plugin that was launched by the AMP Project Contributors. The plugin has a fairly straightforward installation process, allowing you to get your website ready for AMP quickly without issue.
While the AMP plugin gets the job done, there are some downsides to using it. For example, with this AMP plugin, there may be some instances where its default setting won’t be able to accommodate your demands. You also won’t be able to set up AMP ads when using this plugin, which is when the next plugin comes into play.
AMP for WP – Accelerated Mobile Pages
AMP for WP – Accelerated Mobile Pages is a considerably much more efficient plugin as it offers better customizable solutions. It also has a host of features and the developer behind it makes frequent improvements to keep up with the ever-changing ad tech ecosystem.
A few examples of what the plugin offers includes a feature that allows you to add your custom CSS, choose where to display your ads, optimize your ads for viewability, and much more.
Once you’ve chosen a plugin to use for your AMP on WordPress, you can move on to step two.
Step #2: Setup AMP Page Using AMP For WP Plugin
Since most WordPress users choose the AMP for WP plugin, we’re going to explain how to set up this plugin, in particular.
Here’s what you need to do:
- Enter the settings and select your website type, i.e., blog, news, local business, etc. If you don’t see your website category in the list, just select “other” and type it in manually. From there, you can go ahead and select where you need to run your AMP, for example in your blog posts, on your homepage, and so on.
- Now you’ll need to go to Design and Presentation and Analytics Tracking where you’ll have to enter the necessary information — your logo and analytics tracking ID.
- If you plan on collecting data from users with the European Union (EU), you’ll need to enable the Cookie Notice Bar or General Data Protection Regulation (GDPR) settings. (Note: You are not required to enable both at the same time).
This is the first level of AMP setup, and you can return to your Settings section of the AMP plugin at any time to adjust the GDPR and cookie notices.
Step #3: Setup AdSense Ads on AMP Pages
Now it’s time to visit the Advertisement section of the plugin, where you can add up to six ads in various locations, including Below the header, Below the Title, etc. Once you’ve selected the ads for each location you want, you’ll need to enter the ad details like the ad size and type.
To optimize the ads for viewability, you can add a label for Sponsored Content at this time as well.
It should be noted that this is where you’ll come across a restriction with the AMP for WP plugin — you’ll only be able to add ads from Google AdSense or MGID. If you want to serve ads from anywhere else, you’ll need to acquire different plugins that will allow you to do so.
Step #4: Install WP Quads and Setup Google Ad Manager Ads
To serve ads using Google Ad Manager (GAM), you would need to install the WP Quads plugin. Here’s how that’s done:
4.1 Create an ad
Setting up your ads in WP Quads involves Configuration, Targeting, and Publishing.
Start by selecting GAM and entering the necessary information. First, enable the Responsive feature for AMP Compatibility. Then, move on to Targeting by selecting the position to serve the ad and the targeting parameters based on the web page type, category, tag, format, etc.
Then, click Publish to save those settings.
4.2 Advanced settings for the ad
Now go to the Advanced Settings section, where you can do things like add ads.txt files, and enable other integrations like TCF 2.0.
Here you’ll see a list of features you can toggle on or off from ads.txt – Automatic Creation down to Group Insertion Ads. You can choose to use or not use whichever features suit your needs best.
Step #5: Set up Google Analytics
To track your ad metrics, you’ll need to set up Google Analytics. This will also allow you to track third-party data and more to gain valuable user behavior insights.
To do this, you would simply go to Setup > Analytics Tracking or Settings > Analytics (depending on which tracking codes you plan to use). From there, you’ll need to select the providers, insert their respective IDs, and you’re good to go.
Step #6: Validate Your AMP Website and Debug the Errors
Now it’s time to validate your configured AMP website and there are two ways in which this can be done.
Your first option is to use Google Chrome’s AMP Validator Extension, and the second is to run the website through the AMP test.
Once your website is validated, you can troubleshoot any errors using Chrome’s Developer Tools. Here’s how it’s done:
- Entire the AMP-enabled URL in the browser along with #development =1 (It’ll look like this: https://www.example.com/amp/#development =1)
- F
- From there, click on More Tools > Developer Tools and then go to Console. The message “Amp validation successful” will appear if there aren’t any errors.
If a few errors do pop up, you can refer to AMP’s validation error guide to correct them.
What’s Next?
Having a mobile-friendly website is non-negotiable. Everyone uses their phones and smart devices to conduct their most prevalent and on-the-go searches. Therefore, your web pages have to be able to load as fast as possible to meet users’ needs.
Having an AMP-compatible website will contribute to the user experience, boost your SEO rankings, and increase page views and ad impressions. So, it’s time to jump on the AMP bandwagon.