Ankerlink an den Anfang der Seite
z02 6927
Foto von Gabriele Lässer

Nachdem AMP auf einer Website eingerichtet wurde, empfiehlt es sich, das Google Testtool für AMP-Seiten zu verwenden um sicherzustellen, dass Beiträge späer in den Google Suchergebnissen mit AMP-spezifischen Funktionen angezeigt werden.

amp fehler

Nach einem solchen Test entdeckte ich auf einer zu prüfenden Site folgenden (für den Screenshot nachgestellten) Fehler.

Die Ursache war ein CSS-Snippet in der funktions.php des Themes, dazu gedacht, den AMP Header zu modifizieren, und zwar über den Action-Hook amp_post_template_head. Hier hatte jemand ein Style-Tag mit benutzerdefinierten Stilen eingefügt.

add_action( 'amp_post_template_head', 'amp_post_template_custom_css' );
function amp_post_template_custom_css( $amp_template ) {
	$css = 'body blockquote{border-color:#778d9c;background-color:#eceeef}';
	printf( '<style>%1$s</style>', $css );
}

Für normale HTML-Seiten wäre das korrekt gewesen, aber nicht für AMP. Dort muss ergänzendes benutzerdefiniertes CSS direkt in das bereits vorgesehene Tag für <style amp-custom> geschrieben werden. Das Tag darf es nur einmal geben, was die Anwendung des Hooks amp_post_template_css gewährleistet.

add_action( 'amp_post_template_css', 'amp_post_template_custom_css' );
function amp_post_template_custom_css() {
	$css = 'body blockquote{border-color:#778d9c;background-color:#eceeef}';
	echo $css;
}

Und schon ist alles grün.

amp ok

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Hinweis: Name und E-Mail-Adresse (beides optional, da alle Kommentare moderiert werden) werden dauerhaft gespeichert. Über dieses Formular kann jeder Zeit die Löschung persönlicher Daten oder Kommentare angefordert werden; die Anfrage wird nicht veröffentlicht und nach der Bearbeitung gelöscht. IP-Adressen, die mit Kommentaren gespeichert werden, werden nach zwei Monaten automatisch gelöscht.

Ihre Nachricht kann zur Spamprüfung an einen KI-Dienst übermittelt werden. Details: Datenschutzerklärung und Datenschutzerklärung von Mistral AI.