In Genesis Facebook group a user asks:
SHOWCASE-PRO, does anyone know how to load a default “Featured image” on Posts & Pages if none has been attributed to that post or page?
This article presents the customizations in Showcase Pro 2.0.2 to display a default/fallback image for page header for Posts and Pages that do not have a featured image set.
Step 1
In functions.php replace
/**
* Page Header Class
*
*/
function showcase_page_header_body_class( $classes ) {
if( is_page() && has_post_thumbnail() )
$classes[] = 'with-page-header';
return $classes;
}
/**
* Page Header
*
*/
function showcase_page_header() {
$output = false;
if( is_page() ) {
$image = get_post_thumbnail_id();
if( $image ) {
// Remove the title since we'll add it later
remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
$image = wp_get_attachment_image_src( $image, 'showcase_hero' );
$background_image_class = 'with-background-image';
$title = the_title( '<h1>', '</h1>', false );
$output .= '<div class="page-header bg-primary with-background-image" style="background-image: url(' . $image[0] . ');"><div class="wrap">';
$output .= '<div class="header-content">' . $title . '</div>';
$output .= '</div></div>';
}
}
if( $output )
echo $output;
}
with
/**
* Page Header Class.
*
*/
function showcase_page_header_body_class( $classes ) {
if ( is_page() && ! is_front_page() && ! is_page_template( 'page_landing.php' ) ) {
$classes[] = 'with-page-header';
}
return $classes;
}
/**
* Page Header.
*
*/
function showcase_page_header() {
$output = false;
if ( is_page() && ! is_front_page() && ! is_page_template( 'page_landing.php' ) ) {
$image = get_post_thumbnail_id();
// Remove the title since we'll add it later.
remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
$image = wp_get_attachment_image_src( $image, 'showcase_hero' );
$background_image_class = 'with-background-image';
$title = the_title( '<h1>', '</h1>', false );
if ( $image ) {
$background_image_url = $image[0];
} else {
$background_image_url = CHILD_URL . '/images/page-header.jpg';
}
$output .= '<div class="page-header bg-primary with-background-image" style="background-image: url(' . $background_image_url . ');"><div class="wrap">';
$output .= '<div class="header-content">' . $title . '</div>';
$output .= '</div></div>';
}
if ( $output ) {
echo $output;
}
}
We are setting the fallback image as page-header.jpg from the theme’s images
directory.
Step 2
In single.php replace
// Add page header body class to the head.
add_filter( 'body_class', 'showcase_single_page_header_body_class' );
function showcase_single_page_header_body_class( $classes ) {
if( has_post_thumbnail() )
$classes[] = 'with-page-header';
return $classes;
}
// Add page header.
add_action( 'genesis_after_header', 'showcase_single_page_header', 8 );
function showcase_single_page_header() {
$output = false;
$image = get_post_thumbnail_id();
if( $image ) {
// Remove the title since we'll add it later
remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
$image = wp_get_attachment_image_src( $image, 'showcase_hero' );
$background_image_class = 'with-background-image';
$title = the_title( '<h1>', '</h1>', false );
$output .= '<div class="page-header bg-primary with-background-image" style="background-image: url(' . $image[0] . ');"><div class="wrap">';
$output .= '<div class="header-content">' . $title . '</div>';
$output .= '</div></div>';
}
if( $output )
echo $output;
}
with
// Add page header body class to the head.
add_filter( 'body_class', 'showcase_single_page_header_body_class' );
function showcase_single_page_header_body_class( $classes ) {
$classes[] = 'with-page-header';
return $classes;
}
// Add page header.
add_action( 'genesis_after_header', 'showcase_single_page_header', 8 );
function showcase_single_page_header() {
$output = false;
$image = get_post_thumbnail_id();
// Remove the title since we'll add it later.
remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
$image = wp_get_attachment_image_src( $image, 'showcase_hero' );
$background_image_class = 'with-background-image';
$title = the_title( '<h1>', '</h1>', false );
if ( $image ) {
$background_image_url = $image[0];
} else {
$background_image_url = CHILD_URL . '/images/page-header.jpg';
}
$output .= '<div class="page-header bg-primary with-background-image" style="background-image: url(' . $background_image_url . ');"><div class="wrap">';
$output .= '<div class="header-content">' . $title . '</div>';
$output .= '</div></div>';
if ( $output ) {
echo $output;
}
}
Like before, we are setting the fallback image as page-header.jpg from the theme’s images
directory.
Thanks for the complete guide. I am planning to buy this theme and your blog is great for Genesis users. Thanks a lot 🙂
Thanks! Just what I was looking for.