AMPx snippet for MODx Evolution adds support for the Accelerated Mobile Pages (AMP) Project, an open-source initiative launched by Google as a way to improve the overall performance of mobile websites with a lightweight HTML framework that can load instantly everywhere.
With AMPx snippet all posts, category and homepage on your MODx site will have dynamically generated AMP-compatible versions.
With AMPx you can easily create a fully navigable and customizable AMP-compatible website
Installation
Step 1) install with Packagemanager
Step 2) Create a new resource:
- template amp-blank
- richtext: no
- content:
[! ampx!] - pagetitle: amp
Step 3) Add to the HEAD tag a link the AMP version
or use with If snippet:
you can pass tpl parameter via URL:
IMPORTANT: Replace 57 with the ID of resource created at Step 2
Tips:
1) Caching
Caching is not very important, because Google displays AMP pages from AMP Cache CDN, not from your site, ie:
https://cdn.ampproject.org/c/tattoocms.it/amp.html?ampid=172
For better local performance, you can cache the [[ampx]] snippet call, but you have to enable "Cache is based on Resource ID and $_GET parameters" on Manager > Tools > Configuration > Site > Document caching type
2) Display Template variable in amp page from main doc
Basic call
[[AMPtv? &tv=`downloadlink`]]
Output tv using modx widget (ie hyperlink)
[[AMPtv? &tv=`downloadlink` &widget=`1`]]
Output only if tv is not empty (with If snippet):
[[if? &is=`[!amptv? &tv=`downloadlink`!]:!empty` &then=`Download`]]
Issues:
1) validation error with any active plugins that loads something (like js to the page code) with OnWebPagePrerender