WordPress mit Google AMP – schnell und einfach

Google AMP bietet viele Vorteile in puncto Website-Performance auf mobilen Endgeräten und sie erhöhen die Position in den Suchmaschinen auf mobilen Devices. Zwei gute Gründe sie zu nutzen. Ich nutze privat WordPress und auf Arbeit „Interred“. Interred arbeitet mit Layouts und es ist simple, dort ein neues Layout anzulegen. Doch WordPress hat diese Möglichkeit nicht, wie schaffe ich es also, dass mein WordPress ebenfalls mit AMP arbeitet? Dazu gibts zwei Möglichkeiten. Ich löse dies selbst oder ich nutze Plugins.

WordPress mit Google AMP: Schritt für Schritt oder der manuelle Weg

Wer die volle Kontrolle über die AMP-Seiten seines Blogs haben möchte, kann sich gerne ein Plugin selbst schreiben oder das Template entsprechend erweitern. Im Grunde genügt ein Parameter, der an jede URL angehängt wird zur Unterscheidung. Ich nutze eine strikte Trennung von Code und Design mit Twig-Templates. Hier müsste nur in den entsprechenden Controllern die Template-Ausgabe auf ein anderes Twig geändert werden, wenn der Parameter vorhanden ist.

AMP-Templates selbst sind im Grunde genommen eine spezielle HTML-Variante mit Tags speziell für AMP. Die Referent findet sich auf der Seite des AMP-Projektes. Die Styles werden Inline geschrieben oder können auch in einer Option-Seite im Administrationsbereich eingepflegt werden. Es kommt ganz drauf an, wie viel Aufwand man betreiben möchte oder ob dieses Theme/Plugin anschließend angeboten werden soll. Mit Filtern und Actions können auch die eigenen oEmbeds und Shortcuts entsprechend auf AMP umgerüstet werden.

WordPress mit Google AMP: Plugins und in 5 Minuten ist alles da

WordPress bietet auf der eigenen Homepage ein großes Plugin-Verzeichnis. Auch für Google AMP war schnell eines da. Das Plugin „AMP“ reicht für Standard-Blogs völlig aus. Es funktioniert via Parameter an der Beitrags- oder Seiten-URL. Dabei ist es egal, ob Pretty Permalinks verwendet werden oder nicht. Bei Pretty Permalinks wird am Ende der URL ein /amp/ angehängt und sonst /?amp=1.

Einstellungen für dieses Plugin gibt es nicht. Es ist jedoch möglich die Standard-Templates durch Eigene zu ersetzen. Dazu kann man bei eigenen Themes z.B. die functions.php erweitern oder mit Child-Themes oder Plugins arbeiten. Wie das geht, wird auf der GitHub-Seite des Plugins sehr gut erklärt. So kann man z.B. Filter einrichten für:

• das Seitenicon
• das Logo
• das Beitragsbild
• Schema.org – Metadaten
• Templates
• Styles
• Header & Footer

Mit Actions ist es auch möglich die komplette Kontrolle über die Templates zu übernehmen. Eigene oEmbeds und Shortcodes können mit dem mitgelieferten Embed Handler zu AMP-Seiten hinzugefügt werden. Hat man eigene Post Types (Custom Post Types) in WordPress angelegt, müssen diese manuell hinzugefügt werden.

Yoast SEO benötigt ein weiteres Plugin

Wenn das Plugin „Yoast SEO“ verwendet wird, dann wird ein weiteres Plugin benötigt, damit alle Daten & Konfigurationen aus „Yoast SEO“ richtig funktionieren. Das Plugin stammt direkt von Joost de Valk und wird von den AMP-Plugin-Herstellern empfohlen. Es heißt: „Glue for Yoast SEO & AMP„. Darüber hinaus spart man sich mit dem Plugin, den Eingriff in den Quellcode für Custom Post Types und Medienobjekte. Sie können einfach aktiviert werden. Auch das Site-Icon, Logo und  einiges mehr können eingestellt werden.

Vorsicht BUG: Derzeit hat das Plugin von Yoost einen unangenehmen Bug. Es bietet ein Feld für den Google Analytics-Code an. Wenn dieser dort eingetragen wird, dann zählt er im Backend und Frontend wirklich jeden Seitenaufruf und nicht nur auf den AMP-Seiten – also auch die eigenen!

Google AMP in WordPress: Bisschen Luxus gefällig?

„Facebook Instant Articles & Google AMP Pages by PageFrog“ ist das Plugin, das a) etwas Luxus bietet, b) auch Facebook Instand Articles beinhaltet und c) für andere SEO-Tools funktioniert. Hier noch ein paar mehr Features:

• Facebook Instant Articles integriert, Apple News Format in Arbeit
• Live Preview für FBIA und AMP
• Administrator kann bei jeder Seite entscheiden, ob FBIA und AMP aktiv sein sollen
• Styles können im Backend für AMP geändert werden
• Nutzungsanalysen von Google Analytics, Chartbeat und Parse.ly via API möglich
• Ads & Monetarisierung mit AdSense, Audience Network von Facebook
• Custom Ads