The Mega Guide To Configure Accelerated mobile pages for WordPress

0
606

Google accelerated mobile pages WordPress is an enterprise that is currently having a lot of exposure since its launch by Google early October. Accelerated mobile pages google plans to solve mobile web slowness which is the biggest problem on mobile devices and have google accelerated mobile pages. This slowness is very inconvenient to users who have very poor Internet interconnection. It excludes them by harming their Internet accessibility and reducing the conversion rates of their mobile pages.

accelerated mobile pages

AMP  launched as a team’s attempt to have accelerated mobile pages ensuring that all loading content will load immediately to the user’s convenience. By now Google amp WordPress is an initiative that all users should consider if they are ambitious to have a mobile web that is not only competitive in terms all speed but also a mobile web reputable on a league of its own. Many renowned publishers like the Financial Times, the BBC, Guardian News and The Economist have integrated it into their programs, and they have quoted congratulating amp google for its safety and overall convenience.

How Google AMP Functions:

Accelerated mobile pages demo Or say how it Works. It consists of three parts and that framework creates the mobile web pages.

1. AMP JS

The mobile web pages use the JavaScript Framework. Essentially its primary purpose is to synchronous loading manage how the resources are handled. 3rd party JavaScript is unacceptable with AMP.

2. AMP CDN

This one is optional which provides the network for content delivery. It optimizes performance by taking your pages that are AMP enabled and cache them systematically.

3. AMP HTML

It has numerous restrictions, custom tags, and properties and it is also a subdivision of HTML. AMP HTML is rather simple especially with the knowledge of the regular HTML.

The approach for optimization that Google AMP uses to enable accelerated mobile pages is a worthy subject to understand.

Pros and Cons of the Google Accelerated Mobile Pages (AMP)

Apart from the convenience of a fast Internet connection and web pages loading, here are a few flaws associated with AMP that face the users. These are:

  • The AMP supports all Analytics from Google, but it rejects all other Analytics from other platforms.(Recent Update Supports Some)
  • Advertising is also limited to selected platforms of advertising which is an inconvenience to competition.
  • Benefit are mostly to platforms or people who depend on mobile search traffic. They can maintain their Search Engine Optimization (SEO) and keep traffic on their sites.
ALSO, READ  How to Delete a Blog On Blogger

Best WordPress Amp plugin

Before Starting the process of how to set up google amp, I ‘ll first list out the some of the amp WordPress plugins which will help you in easily integrating the google amp with your WordPress website.

These WordPress amp plugin, which is listed below, are free, stable and get regular updates from the developer. However, some require paid subscriptions for Extra services.

1.AMP

AMP is a core plugin, also necessary for other amp plugins to work properly. This plugin is perfect for beginners and those who are looking to get the hang of AMP optimization easily. It does provide some extra customization option which you can get on GitHub.

amp project

It also supports Plugin integration like:

  • Jetpack
  • Parse.ly  -For tracking AMP pages when enabled along with this plugin.
  • Yoast SEO

Issues:

  • CloudFlare Rocket Loader (modifies the output of the AMP page, which breaks validation.)

This plugin can be easily set up. Just install it and its ready to work. You can check your amp page by adding /amp after your post URL.

2.AMP for WP – Accelerated Mobile Pages

This is the most popular plugin that will instantly optimize your WordPress site for AMP. AMP for WP offers a large no of  Customization options including analytics and Adsense Support. The plugin gets regular bug fix updates and also new features introduced after a short time span. Most Recommend Plugin for Google amp WordPress.

enable amp on wordpress

Features

  • Genesis SEO Support  (New)
  • Facebook Instant Articles Support Added  (New)
  • Widgets & WooCommerce
  • Custom AMP FrontPage
  • Gravity Forms Support (New)
  • Page Break / NextPage (Pagination) Support (New)
  • And much more which you can check here

Usage

AMP for WP has a lot of features which can do a lot of customization and add analytics codes including Adsense. Here I’ll add all the process step by step.

Changing Amp Design

There is an option to select between different amp WordPress theme which will give the unique design to your amp pages. Currently, there is three different amp WordPress theme available. Also, the plugin developers have released a theme framework which lets you create your own custom theme for your WordPress website

Change the theme with available themes in WordPress AMP follow the steps below :

  1. Go to Design Tab
  2. Click On Design Selector and select any themes you prefer.
ALSO, READ  3 Best Web Hosting for Small Businesses

designing amp blog

Enabling Google Amp for Homepage/Pages

These days responsiveness of site is taken as an SEO factor, tough many WordPress sites use themes which are not responsive and loads the desktop version in mobile. Here a simple solution for that you can enable amp in homepage and archive or blog pages which will load the amp mobile-friendly version of the site instead of the desktop version. This option will let you select to use google amp homepage and other pages instead of your desktop default version.

  • Go to Amp Setting > Homepage
  • Enable the homepage Support.

enable amp on front page

Adding Analytics code

Amp analytics will help you to track the page view, sales, and other data as similar to the normal version of the WordPress website. In the latest version of the plugin, this also supports the pixel analytics code. Follow the below steps to enable the amp analytics on your site.

  1. You can either use google analytics code or google tag manager in AMP for WP Plugin. Copy your analytics Code from your account which will something like this  UA-XXXXX-Y.
  2. Now Go to the analytics section and place your Code.

Accelerated mobile pages

You are Done.

Adding Adsense Ads

Most useful features of this plugin that it lets you enable Amp Adsense within the plugin. You can enable ads on top and footer of your article. To place ads in the middle of the article the plugin has a premium extension named Advanced Amp ads. To add ads in google amp plugin you need to get the  Data Ad Client id(ca-pub-XXXXXXXXXX) and Data AD Slot(70XXXXXX).

  1. Go to Advertisement and place your codes. 🙂
ALSO, READ  3 Most Common Affiliate Mistakes You Can't Afford To Miss

Adding Adsence Ads in amp

Enable Contact Form 7/Gravity  Support

Contact Form is essential everywhere and it should accessible and viewable easily to any visitor, by keeping this in mind plugin developers have added support for the most popular contact plugins contact form 7 and Gravity form.

  1. Go to the contact form.
  2. Enable the Contact Form 7 Or Gravity Forms Support

Contact form support amp

Drag & Drop Post Builder

Custom amp pages can also be made with this plugin, either it is landing or any type of pages. Want to view different post rather than the original this plugin also lets you do this by adding custom post panel which is available below the default WordPress post creator.

  1. Go to design.
  2. Click on Launch post Builder.

using post builder in amp

You can change the layout elements of your Amp post with the help of this builder.

Enable Mobile Redirection

Mobile redirection will redirect the users to the amp version which is a lot faster than the mobile version of the site. Users will no longer able to access the default version of a site.

  1. Go to Advanced Setting.
  2. Enable the Mobile Redirection. Now all the pages and post on mobile gets redirected to amp version 🙂

Enable mobile redirection in amp

Building Landing Pages

With this plugin, you can easily build landing pages for AMP from the widgets area.let’s see how to do this :

  1. Go to Page builder in amp setting.
  2. Enable the page builder for an amp.

creating landing pages in amp

Now go to the Appearance >Widgets

Creating landing pages in google amp

Use the marked widgets in the image to create your landing pages

This Completes your setup of google amp for WordPress.Until the time Google recrawls your website and detect the amp you can check it manually by adding   /amp after your post URL. If you have any query related to google amp or something which is missing out here let us know in comment section.

Last Updated on

LEAVE A REPLY

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.