Google’s new Accelerated Mobile Pages is incredibly easy to activate with WordPress
Always pushing to make the web more accessible, google has taken a big step towards faster mobile browsing.
With heaps of the world still having slow or no mobile data, Google’s new AMP project allows pages – which may normally take several seconds to load on your phone – to load effectively instantaneously. Through a specialised
Brad Denver discussed the new technology and how we can start using it right now.
Fortunately for us WordPress developers, Automattic, creators of WooCommerce and other great WordPress plugins, have released a plugin “amp-wp,” which simply creates an AMP – friendly version of your posts. It looks like Automattic are also living up to their mantra of making the web a better place.
I had a crack at this today, and it took care of the complexities of AMP very fast! Here’s the deal:
- simply “Add New” plugin from your WP dashboard and search for amp-wp
- it should be the first plugin there – Install and activate
- do a quick permalink reset -> Settings -> Permalinks -> Save (without making any changes)
- Boom! Your posts should be AMP-ready
This worked right out of the box for me when I tested with google’s method:
- I navigated to a normal address for you post, in this case, swish.online/blog/best-web-development-learning-resources/
- added amp/#development=1 to the end of the URL
- reloaded page inspected the site in Chrome inspector
- in the inspector console, I was happy to see the success:
- If the same *doesn’t* happen for you 🙁 Google has some troubleshooting steps you can take to fix it
Note, for now, this only works for actual posts, not pages. So no, you won’t get a pretty AMP homepage on mobile. The premise is more about ‘articles,’ i.e. news stories and blog posts, coming up cleanly and quickly in the new carousel style search results you may have experienced since late 2015.
Here’s my brand new AMP-ready post:
- essentially, it is all the necessary bits of the post, stripped back of [maybe] unnessecary styles, images, and Js
- this is the inspector version
- I didn’t see it in a quick live search, so I’m excited for the cached caching kick in ->
I’ve given the instructions to do this by popping into my Google Search Console and having google crawl the AMP page as a mobile user, then submitting the crawl to Google’s cache.
My final thoughts for now:
- definitely go give the plugin a shot
- google will inherently index AMP-friendly results higher on mobile searches
- the post will be stripped-back, so your users will have a better time on your site
- it’s not how I want all posts to look at all times, but if it gives someone a better chance to read my content on the train home, go for it Google!