Google startete mit AMP ein Open Source Projekt um Inhalte auf mobilen Endgeräten noch schneller aufrufbar machen zu können. AMP konforme Inhalte erscheinen innerhalb der Google Suche auf mobilen Endgeräten mit einem zusätzlichen „Flag“.
Während viele größere Firmen vor der Herausforderung stehen, alle ihre Inhalte als AMP technisch zugänglich machen zu können, ist es mit WordPress sehr einfach, genau dies umzusetzen. Wie so oft bei WordPress ist hierzu nur ein Plugin notwendig.
Mittlerweile gibt es bereits einige AMP Plugins für WordPress. Sieht man sich jedoch die Bewertungen an, kommen nur sehr wenige Plugins in Betracht. Wir haben uns bei unserem webworks Blog für das Plugin AMP von Automattic entschieden:
Schritt 1: Google AMP Plugin installieren
Gehen Sie im WordPress Plugin auf Plugins und dann auf Installieren. Über die Suche geben Sie „amp“ ein und installieren das AMP Plugin von Automattic mit einem Klick auf den Button „Jetzt installieren„:
Schritt 2: Google AMP Plugin aktivieren
Sobald die Installation fertig ist, können Sie über den Button „Aktivieren“ das Plugin aktivieren:
Nach dem aktivieren des Plugins finden Sie das Plugin unter Plugins – Installierte Plugins.
Sobald das Plugin aktiviert ist, sind ihre Beiträge bereits als Google AMP Beiträge verfügbar. Hierzu genügt es, wenn Sie einen Beitrag aufrufen und /amp/ an die URL anfügen. Den vorliegenden Beitrag finden Sie bspw. als AMP Version unter der URL http://www.webworks-agentur.de/google-amp-fuer-wordpress/amp/.
Schritt 3 optional: Google AMP Anpassungen
Je nach WordPress Theme und eigenen Anforderungen kann es sein, dass noch weitere Anpassungen notwendig sind. Bei unserem Beispiel hat der komplette Headerinhalt gefehlt. Sowohl Logo als auch Seitenname waren nicht vorhanden. Unter Plugin – Bearbeiten kann direkt in den Quellcode des Plugins eingegriffen werden. Hierzu war folgender Code notwendig, um den Seitennamen und das Seitenicon im Header anzeigen lassen zu können:
add_filter( ‚amp_post_template_data‘, ‚xyz_amp_set_site_icon_url‘ );
function xyz_amp_set_site_icon_url( $data ) {
// Ideally a 32×32 image
$data[ ’site_icon_url‘ ] = get_stylesheet_directory_uri() . ‚/images/webworksicon.png‘;
return $data;
}
Notwendig hierfür sind ein Favicon im PNG Format sowie ein eingetragener Seitenname.
Zusätzlich kann man unter Design – AMP die Farben des Headers an sein herkömmliches Layout anpassen. Die Google AMP Seite dieses Blog Artikels sieht nun wie folgt aus:
Nach einigen Tagen hat Google den vorliegenden Artikel das erste Mal gecrawlt und indexiert. Auf mobilen Endgeräten verweist Google den Nutzer direkt auf die schnelle AMP Version des Artikels. Dies erkennt der Nutzer bereits in den Suchergebnissen anhand des Blitz Symbols von AMP: