Accelerated Mobile Pages (AMP), a simple and elegant solution that can streamline the information much faster without all the extra baggage that a typical website has. It loads instantly and dramatically improves the performance of the mobile sites. AMP is an open source initiative build in collaboration with many different partners. AMP is just like a normal HTML website with a couple of restrictions on the extra baggage. So let’s implement AMP on WordPress.
Walk through the below steps to enable AMP for your website
There are two methods to Activate AMP for your website
After Activating the plugin, You will see a Message saying “This Theme requires following Plugin: AMP, Begin Installing Plugin” –> Click on Begin Installing Plugin –> Install
(OR)
Extract the downloaded Zip files
Login to your FTP client (Here we are using Filezilla) –> Navigate to Root Directory –> WpContent –> Plugins –> Upload the extracted folders
Login to WordPress Admin panel –> Plugins –> Now Activate the uploaded plugins.
After Activating the plugin, You will see a Message saying “This Theme requires following Plugin: AMP, Begin Installing Plugin” –> Click on Begin Installing Plugin –> Install
I decided to test the loading speed of one of the AMP enabled post and compare it with AMP and NON-AMP. We have chosen a blog post with has content with images. We tested this Blog Post on Gtmetrix.com. Blog post gets a standard loading speed of 11.1 seconds , But with AMP the page is loaded 1.2 Seconds. Almost 10x less the loading speed of Non-AMP Page.
After activating the AMP, Google will automatically index the amp pages using the amp tag, To test AMP version of the website, Simply, Add /?amp at end of the URL. For Example (http://Example.com/?amp)
If Google detects any error in your AMP page, that page won’t be visible or distributed in the Google AMP cache.
There are Two different methods for checking AMP error on Website.
The AMP chrome extension automatically scans for the validation errors and will notify you when you are on amp page.
Now Open your AMP Activated Website, Check AMP chrome extension on Top Right Side.
Now google allows you to place Advertisements in AMP page.
Go through the below steps for adding Advertisements in AMP page
To check the ads open up the Website by /?amp in End (http://Example.com/?amp) disabling the adblocker. (Check the Screenshot below)
Login to Google Analytics Account –> Go to ‘Home‘ tab –> Copy Analytics Code
Login to WordPress Admin panel –> Navigate to AMP (This opens the AMP settings Panel) –> Go to General tab
Adding Logo and Changing Color
Login to WordPress Admin panel –> Navigate to AMP (This opens the AMP settings Panel) –> Go to General tab –> Click on Upload and Select the Image from Existing Media or Upload new Image –> Click on Select And Change the color Click on Select Color –> Then Select any Color which is suitable for your website –> Save Settings
There are lot options which will make your website more eye-catching
Google AMP pages look kind of interesting because the AMP enabled pages to load 4x faster than standard pages. Integrating AMP on WordPress website is easy and it enables you to stay on top in all Search Engines, glean the rewards without any hard work.