Setup completed
As of September 1st, 2022, wbAMP is discontinued. The AMP technology is on its way out and most users are progressively phasing it out, while Google itself no longer requires it for SERP features such as Top Stories or News carousels. The extension will be in security mode only, meaning only security issues will be fixed going forward, for existing subscribers. It is no longer possible to purchase or renew wbAMP subscription.
From that point on, assuming you have some articles that match the rules you setup, wbAMP will create an Accelerated Mobile Pages of your site. In practice,it means:
AMP pages are advertised
Assuming you have selected the Normal
operation mode, a rel
tag will be inserted in your regular pages, when they have an AMP version:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-gb" lang="en-gb" dir="ltr">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<base href="http://local.web/products/wbamp/src/main/sample-sites" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content="Joomla" />
<meta name="generator" content="Joomla! - Open Source Content Management" />
<title>Sample Sites</title>
<link href="http://local.web/products/wbamp/src/main/sample-sites/amp" rel="amphtml" />
If you selected earlier Development
as the operation mode, this rel
tag will not be inserted in your normal pages until you select again Normal
. This is to give you time to verify and validate your AMP setup.
AMP pages are served
When a user or a search engines, requests the AMP URL specified in the rel
tag above, wbAMP will detect it and serves a specially formatted page:
This page in turns contains a canonical tag, that points back to the main, regular HTML, version of the page, so that no duplicate content happen and search engines can relate both pages:
<!doctype html>
<html lang="en-GB" amp>
<head>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,minimal-ui">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic|Open+Sans:400,700,400italic,700italic" rel="stylesheet" type="text/css">
<title>Parks Home</title>
<link rel="canonical" href="http://local.web/products/wbamp/src/main/parks-home" />
<style>body {opacity: 0}</style><noscript> <style>body {opacity: 1}</style></noscript>
This example is extremely simplified, but you can use your own CSS, images, and some AMP-specific tags that we will cover in the Going further section of this documentation.