1

I hope this hasn't been covered already - I couldn't find it using my keywords. I designed a site with a new header image for each page. I call it on every page in the header.php file like this:

<img src="<?php echo the_post_thumbnail_url('full'); ?>" alt="Header Image">

I've enabled featured images in functions.php (add_theme_support('post-thumbnails');) and it works fine on literally every other page on the site.

Under Settings > Reading I switched the Front Page Displays: option from Your latest posts to A static page and set my Home and Posts pages to Home and Blog (pages I've created in the dashboard).

When I load the blog page, it shows an empty image container. Inspecting the elements shows that there is no src set. If I unset the /blog/ page as the Posts page under Settings > Reading, the image appears. I've tried this with /blog/ using index.php as its template and with it using home.php as its template. No difference.

If the Blog Page lets me set a featured image in the WordPress dashboard, why won't it display?

EDIT: I'm seeing this question, but the answer doesn't actually tell me why or what's happening.

1 Answer 1

2

When you have the Posts Page: set to "Blog" and then you visit the page directly (via the slug) does the header image display?

Setting the static "Posts" page to your "Blog" page overrides the template. Wordpress will use the Template Hierarchy to figure out which file to use to display the blog posts.

The problem is that WP_Query contains the list of posts to display because the settings are telling it that that page is used to display posts, and not that it is an individual page.

This means the template won't necessarily be aware of the page settings from when you edited the page.

We need to look at conditional tags documentation to find the right pattern to use:

if ( is_front_page() && is_home() ) {
  // Default homepage
} elseif ( is_front_page() ) {
  // static homepage
} elseif ( is_home() ) {
  // blog page
} else {
  //everything else
}

Using that pattern (or something similar) you can update your code to this:

// Use Conditional Tags to find out if you are on the header page
<?php if ( is_home() ) : ?>
<img src="<?php echo get_the_post_thumbnail_url(*BLOG PAGE ID HERE*,'full'); ?>" alt="header" />
<?php else  : ?>
<img src="<?php echo get_the_post_thumbnail_url('full'); ?>" alt="header" />
<?php endif; ?>

Using something like that, WP will grab the thumbnail URL based on the page settings.

Note my usage of get_the_post_thumbnail_url() including the Page ID to pull the header image from. Also your usage of the_post_thumbnail_url() is incorrect. The echo you used is redundant since the_post_thumbnail_url() is used to print the thumbnail URL. See the source here.

EDITED for clarity

8
  • No, the image still doesn't display when I hit the end point (slug) manually. I tried creating home.php for the blog archive to see in the template hierarchy, but to no avail. Perhaps home.php isn't the right template when static pages are chosen? Jan 6, 2017 at 21:56
  • Thanks for pointing out the syntax error with the_post_thumbnail_url. It was working for me as-is, but I'd prefer to do it correctly of course. Jan 6, 2017 at 21:57
  • I am sorry I wasn't clearer @armadadrive, The problem is that WP_Query contains the list of posts to display because the settings are telling it that that page is used to display posts, and not that it is an individual page. So it basically ignores much the page settings like post thumbnails. I'll edit my answer to show you how to get it to work.
    – David
    Jan 7, 2017 at 0:55
  • Thanks! I'll give it a shot and mark this correct if it works. It sounds logical so I'm hopeful this is the right answer. Jan 7, 2017 at 2:27
  • Hmm. This isn't working for me, unfortunately. I've tried hardcoding the blog page integer (9 in my case) and using global $post; and passing $post->ID. The other pages work, but not the blog. Jan 7, 2017 at 16:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.