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.
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.
Schreibe einen Kommentar