Customer Happiness Manager at PressMate January 16, 2018

We used AMP For WP and here is what we think about it

how to use google amp in wordpress

what is Google AMP?

I think you all know what AMP is. Well, it’s not the ampere used for measuring current. AMP is a google project focused on building pages that load quickly on mobile. The target is to load pages under 1s. When I heard this for the first time, I was like LOL, 1s ? But, this week we just did think of launching the AMP version of our blog. To do this, we took help of a plugin called “AMP for WP“. AMP for WP is a free plugin that does the work for you. I am not a big fan of using plugins. However,I feel that you should use AMP for WP plugin as it does the work quickly.

The best way to implement AMP is to start building your HTML using AMP and then code your own WordPress Theme. A starter guide to building your own AMP page can be found at https://www.ampproject.org/docs/tutorials/create.  Just to give you an idea, AMP needs you to write amazing HTML with clean CSS. So, if you’re a HTML developer who has way too much !important tags in it’s CSS, you are going to have hard time. And if you are a WordPress Developer using any of the Theme Builders, this is a long journey for you. Things to remember before using AMP for your WordPress Websites

  1. While using AMP , you cannot use any third party JS tools like jQuery, Angular, etc
  2. Forget your fancy sliders, carousels. You cannot use them at all
  3. Your contact forms plugins like contact form 7, gravity forms, etc won’t be functional in AMP website
  4. You cannot have your CSS files in <link> element
  5. All the CSS needs to be less than 50k
  6. You cannot have !important in your CSS
  7. No <iframe> embeds 😮

These are just few restrictions that I remember at the moment. For sliders, carousels, lightbox and many other interactive or even small features, you need to use the plugins developed by AMP. Take a look at https://ampbyexample.com/#components

Before I go ahead and give you more insights about my views regarding the final output of AMP For WP and whether I am satisfied or not , let’s take a look at what realistic expectations you shall be keeping from this “free to use” plugin.

Pros of using AMP for WP

  1. Quick Set up
  2. Good plugin to start with
  3. Supports major videos / images and AMP tags
  4. Easy to use Backend Interface
  5. Generates Valid AMP HTML
  6. Does the JS & CSS clean up
  7. Automatic Mobile Redirection to /amp version of your post

Cons of using AMP for WP

  1. Only plugin that does the job
  2. Good to be used for blog / post section only
  3. Supports page but renders only “WP Content” ( explained in details below here )
  4. No free support for Contact Form
  5. Very basic Implementation
  6. Too Expensive Add Ons
  7. Adds /amp ahead of your URL.
  8. No free support for Custom Post Types / ACF
  9. Very basic design.

So, that we have taken a look at the Pros & Cons of AMP for WP plugins, let’s see what happened with our blog when we used AMP for WP.

1. Our blog posts were automagically converted into AMP pages 😎

Yup !! This was a great feeling. All our blog posts were converted into AMP HTML that too validated with automatic redirection for mobile. The AMP version of our blog post can be accessed by adding a /amp to the end of the URL . If you are checking this on your desktop at the moment, just open this URL on your mobile and you will be automatically redirected to the AMP Version.

2. Drastic change in the load time ( under 1s )

The plugin helped us achieve what I always wanted. I was able to get a load speed of under 1s. Check the comparison chart above that highlights the difference between load time of  AMP & Non AMP version on pingdom tools

3. Google now marks our pages with an amazing AMP icon 😉

All that we did was submit AMP version of our pages to Google to get them crawled. Once this was done, Google started accepting and showed a small “⚡” in front of our pages. I hope it improves our SEO ranking too

 

4. We tried to convert our pages to AMP

Don’t do that!! Just don’t if you are using AMP for WP only without the Add Ons. Most of the content on my pages is pulled from ACF. Below is a very small comparison of what happened when we switched on the AMP support for pages. It just pulled in the content from Editor and placed it. For my pricing page, there is no pricing table. For my contact page, there is no contact form 🙁

This is just a great start for AMPesizing our blog. I firmly believe that you shall build your HTML using AMP and extend the support for your pages without buying an Add On. Building your HTML using AMP is not an easy job. But, believe me it’s not impossible either.

Even if I wish to start having AMP version for my complete website, I personally feel that this is not possible using AMP for WP. We have very specific requirements when it comes to mobile versions of website. With AMP for WP, you will get a very basic design and I have an opinion that it’s best fit for publisher websites, news sites  & blogs. Using AMP For WP for your brochure website is not something I’d recommend. Even to have my pages run with ACF Content , an email opt in form, comments and a contact form 7, following are the Add Ons that I will have to purchase

$79 – Email opt ins
$39 – Contact Form 7
$29 – ACF Support
$29 – Comments

This adds up to $180. Wow!! Not spending that much for a very basic AMP website. So let’s come up with a conclusion

Conclusion

  1. The job done by AMP For WP guys is highly commandable.
  2. It has add ons that will get your other jobs done like adding a contact form, email opt in, etc.
  3. It’s good for blogs, not for websites with fancy designs
  4. “AMP For WP” free version takes the content only from your WP Editor
  5. We are working on coding a theme that uses AMP HTML at it’s core. This will remove the need of adding /amp is front of your URL for AMP version of your website.

So, stay tuned, there is lots coming up in next few months from our amazing developers at PressMate.

 

2

Enjoyed the article?

Press 💚 below and join the other 13,000+ getting valuable updates from this blog.

blog live chat software

We ditched ZOPIM for Chatra


April 28, 2018 6:45 AM

blog Uncategorized wordpress wordpress security wordpress updates

How To Secure Your WordPress website


April 27, 2018 6:33 AM

blog plugins wordpress wordpress updates

How to update WordPress plugin properly


March 27, 2018 10:58 AM

blog plugins wordpress wordpress updates

What are automatic WordPress updates and how to turn them on


March 26, 2018 1:46 PM

Get Free Site Analysis

Want us to analyze your site first and then use our services? No worries. Just fill out the form to the right and we will be happy to send you a free report about your current website.