Complicated question. In my wordpress site I have the single.php page to display each post when selected from homepage. The single.php brings in a custom header-int.php (the header for index.php is different) each article (post) contains this code
On the index page each 'article' (post) is placed . Each article has the following code The background is the featured image (displayed as thumbnails on the index page)
article.php
<?php
if (has_post_thumbnail()) {
$thumbnail_data = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), 'my-fun-size' );
$thumbnail_url = $thumbnail_data[0];
}
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(''); ?>>
<div class="bg-img-LC" style="background-image:url('<?php echo $thumbnail_url ?>');">
... content of article/post ...
The single.php brings in content-single.php with
single.php
get_header('int'); ?>
<main role="main">
<?php while ( have_posts() ) : the_post(); ?>
<?php get_template_part( 'content', 'single' ); ?> ...
content-single.php
<div id="post-<?php the_ID(); ?>"> ... displays images and text from post
header-int
<body id="skrollr-body" <?php body_class('container-fluid'); ?> >
<?php
if (has_post_thumbnail()) {
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full');
echo $large_image_url[0]; // Image Url
}
?>
<div class="jumbotron row" style="border-radius:0px;">
<header>
<div class="navbar navbar-custom">
...
I want the 'featured image' from the post to be the background of the jumbotron in the custom header-int.php file.
or perhapse a better way to accomplish this.
If you want to get feature image from post then you can display feature image using following code :
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full');
echo $large_image_url[0]; // Image Url
You can change second parameter of wp_get_attachment_image_src() to (thumbnail, medium, large, or full) as per your need.
Edit
Your header-int.php file should be
<body id="skrollr-body" <?php body_class('container-fluid'); ?> >
<?php
if (has_post_thumbnail()) {
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full');
echo $large_image_url[0]; // Image Url
}
?>
<div class="jumbotron row" style="border-radius:0px;background-image:url('<?php echo $large_image_url[0]; ?>');">
<header>
<div class="navbar navbar-custom">
...