Ein Block-Theme-Snippet ermöglicht auf Archivseiten, Kategorieseiten und der Suche ein Cover mit dem Beitragsbild des ersten sichtbaren Beitrags anzuzeigen, ohne Custom Fields oder separate Templates zu benötigen. Beim Blättern wechselt das Headerbild entsprechend dem ersten Beitrag der jeweiligen Seite.
Dazu wird der Block-Kontext für den Cover-Block angepasst und oberhalb des Loops im Template ein Cover eingefügt. Das Bild erscheint erst im Frontend; zusätzlich können Archivtitel und Beschreibung im Cover ausgegeben werden.
Ein eigenes Headerbild für jede Kategorieseite? Im Coverblock? – Ohne Custom Fields? Ohne für jede Kategorie ein eigenes Template zu benötigen? Das geht tatsächlich, mit diesem Snippet – und einem Block-Theme. Das Snippet holt sich das Beitragsbild des jeweils ersten Beitrags, der auf der aktuellen Archivseite sichtbar ist (beim Blättern kommt also ein anderes).
function we_cover_featured_everywhere_block_context( $context, $parsed_block ) {
if ( is_admin() || ! is_array( $parsed_block ) ) {
return $context;
}
if ( empty( $parsed_block['blockName'] ) || 'core/cover' !== $parsed_block['blockName'] ) {
return $context;
}
if ( empty( $parsed_block['attrs']['useFeaturedImage'] ) ) {
return $context;
}
if ( ! empty( $context['postId'] ) ) {
return $context;
}
if ( in_the_loop() ) {
return $context;
}
if ( ! is_home() && ! is_archive() && ! is_search() ) {
return $context;
}
global $wp_query;
if ( empty( $wp_query->posts[0] ) || ! ( $wp_query->posts[0] instanceof \WP_Post ) ) {
return $context;
}
$context['postId'] = $wp_query->posts[0]->ID;
$context['postType'] = $wp_query->posts[0]->post_type;
return $context;
}
add_filter( 'render_block_context', 'we_cover_featured_everywhere_block_context', 10, 2 );
Dann in Templates für Archivseiten oberhalb des Loops ein Cover einfügen, als Bild Beitragsbild wählen, vielleicht noch Archivtitel und Beschreibung rein, und das erste Bild auf jeder Archivseite ist das Headerbild. Sieht im Template nicht spektakulär aus, ein Bild kann hier est im Frontend geladen werden.

Das Snippet findet auch hier im Blog Anwendung.




Schreibe einen Kommentar