Inherit Post Thumbnail Background Image from Parent

Based off of this entry and modified from this source trail, the below snippet will help you embed featured images and backgrounds, and make child pages inherit them from parents.

<?php 
if ( ! has_post_thumbnail() ) {		
	    // the current page has no feature image
	    // so we'll see if a) it has a parent and b) the parent has a featured image
	    $ancestors = get_ancestors( $post->ID, 'page' );
	    $parent_id = $ancestors[0];
    if( has_post_thumbnail( $parent_id ) ) {
        // we'll use the parent's featured image
	        $id = $parent_id;
    }
}
		
$image = wp_get_attachment_image_src( get_post_thumbnail_id($id), 'full' );

		
?>  
    
<div id="main" style="background: url(<?php echo $image[0]; ?>);">

January 27, 2017 Update:

Here is a more comprehensive statement to inherit the post thumbnail from parent, and ancestor, pages:

global $post;

$parent = $post->post_parent;
$grandparent_get = get_post($parent);
$grandparent = $grandparent_get->post_parent;

$parents = get_post_ancestors( $post->ID );
$ancestor = ($parents) ? $parents[count($parents)-1]: $post->ID;

if(has_post_thumbnail()) {
	$subheader_img = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full' );
} else if(is_ancestor($ancestor)) {
	$subheader_img = wp_get_attachment_image_src( get_post_thumbnail_id($ancestor), 'full' );
} else if(is_child($parent->ID)) {
	$subheader_img = wp_get_attachment_image_src( get_post_thumbnail_id($parent->ID), 'full' );
} else {
	$subheader_img = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full' );
}

?>

<div id="subheader_image" style="background-image: url(<?php echo $subheader_img[0]; ?>);">

Use in conjunction with is_child and is_ancestor functions.

Leave a Reply

katherine as a flat graphic icon

About Me

I’m an African / Ojibwe First Nations Web Developer living in Winnipeg, Manitoba.

Visit the Tips and Blog to see what I’m working on.