Largest Contentful Paint image was lazily loaded

foto von lionolin, pixabay
biene eifrig bei der arbeit

foto von lionolin, pixabay

Das Lazy-Loading des „Largest Contentful Paint-Bildes“ löst eine Lighthouse-Warnung aus. Meistens dürfte das Einzelbeiträge mit Beitragsbildern treffen. Die von mir über den Coverblock eingefügten Beitragsbilder erhielten das Attribut „loading“ mit dem Wert „lazy“, was eigentlich nur dann erwünscht ist, wenn sich ein Bild beim Aufruf einer Seite (noch) außerhalb des Sichtbereichs befindet.

Das Tag hat auch einen direkten Filter, allerdings muss man den Output z.B. nach „wp-post-image“ durchsuchen, um herauszufinden, ob man es grade mit einem Beitragsbild zu tun hat.

add_filter( 'wp_img_tag_add_loading_attr', function( $value, $image ){
	if ( false !== strpos( $image, 'wp-post-image' ) ){
		return false;
	}
	return true;
}, 10, 2 );

Er ist allerdings gut geeignet, wenn man lazy load ganz abschalten möchte.

add_filter( 'wp_img_tag_add_loading_attr', function( $value, $image ){
	return false;
}, 10, 2 );

Um nur das Beitragsbild „eager“ zu laden, entschied ich mich für den „wp_get_attachment_image_attributes“-Filter. Er ersetzte tatsächlich nur im Beitragsbild den Wert des „loading“-Attributes. Der Wert „eager“ (eifrig) ist ein ebenfalls gültiger Wert für das Attribut „loading“.

function disable_lazy_load_single_featured( $attr, $attachment, $size ) {
	if ( !is_single() ) return $attr;
	$attr['loading'] = 'eager';
	return $attr;
}
add_filter( 'wp_get_attachment_image_attributes', 'disable_lazy_load_single_featured', 10, 3 );

Nicht funktioniert hat hingegen das Snippet mit dem ich versuchte, das Attribut zu entfernen. Im Debug-Output war zwar zu sehen, dass nach dem „unset“ das Attribut tatsächlich weg war. Offenbar suchte eine später in Aktion tretende Instanz nach dem Attribut und fügte es wieder mit dem Wert „lazy“ ein, wenn es nicht bereits vorhanden war, wohingegen beim Überschreiben nicht mehr weiter mit dem Attribut passierte. Das bedeutet allerdings nicht, dass es bei Dir nicht erfüllt was es soll.

function disable_lazy_load_single_featured( $attr, $attachment, $size ) {
	if ( !is_single() ) return $attr;
	unset( $attr['loading'] );
	return $attr;
}
add_filter( 'wp_get_attachment_image_attributes', 'disable_lazy_load_single_featured', 10, 3 );

weitere Beiträge zu:

Bitte Kommentarfunktion nicht für Supportanfragen nutzen. Dem kann hier nicht entsprochen werden. Die Angabe einer E-Mail-Adresse und eines Namens ist nicht erforderlich. Einen (Spitz)-Namen zu nennen wäre aber doch nett.

Schreibe einen Kommentar

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

Hinweis: Sowohl angegebener Name als auch E-Mail-Adresse (beides ist optional, dafür werden alle Kommentare vor Veröffentlichung geprüft) werden dauerhaft gespeichert. Du kannst jeder Zeit die Löschung Deiner Daten oder / und Kommentare einfordern, direkt über dieses Formular (wird nicht veröffentlicht, und im Anschluss gelöscht), und ich werde das umgehend erledigen. – Mit hinterlassenen Kommentaren hinterlegte IP-Adressen werden nach zwei Monaten automatisch gelöscht

publicly queryable