Add Featured Image at top of Single Post/Page in Genesis

One of the latest themes from Genesis has the ability to show the featured image that is set to appear at the top of a post or page, the setting is shown in the Customizer and is enabled by default – here is how you can use this in any Genesis theme.

show-featured-image-post-page

It is best to modularize the customizer and image functions into respective files but you can add the whole thing in functions.php.

Add the Customizer Fields and Settings

So add in the Customizer controls

Add in the function to add the Featured Image

If you wanted the image to appear before the header you would change the add_action hook to genesis_entry-header

Doing It Alone

If you didn’t care about the customizer control you can just add the featured image to the post with this amended snippet…

Using Custom Image Sizes

For any image sizes outside of thumbnail, medium or large you need to pass in the size and crop values in an array like this…

size => array(300, 450, true),

So you pass in widthheight and whether or not to hard crop; true for yes and false for no.

12 Comments

  1. Jared on May 25, 2019 at 7:13 pm

    Just used this to add featured images on the Infinity Pro theme. Works perfectly. Didn’t want to deal with creating extra files, so dropped everything into functions.php. Thank you!

  2. Christina on January 2, 2019 at 5:42 pm

    Thank you so much.
    The code works great!

    Christina

  3. Mas on November 20, 2018 at 4:33 pm

    Thanks for the info. Do you know how I can get the image with a position: fixed so content slides over it?

  4. Jana B on August 1, 2018 at 9:21 am

    Thank you … just what I needed.

  5. Stephen on May 3, 2018 at 6:52 pm

    Great tutorial and code. Thank you!

    I have noticed that the featured image only shows up on the individual post pages. I would like the image to show up on the main blog posts page as well. How could I do this? I am using the latest Genesis Sample theme v. 2.60 and want to display the posts on the home page.

    Thanks again for your help.

    – – Stephen

  6. Masud Pilot on April 20, 2018 at 7:00 am

    I was finding these snippets to show featured image in my genesis based theme.
    Thanks for sharing.

  7. Marketer Press on January 23, 2018 at 4:22 pm

    Thanks, man it Really helped me a Lot.

  8. sat on August 26, 2016 at 7:09 pm

    Thanks for the article, I am moving to the Magazine Pro theme I was not able to figure out how to set the featured image on a blog post. Your article was a great help setting up the featured image option in my Genesis child theme.

  9. Ricardo on July 19, 2016 at 6:30 pm

    This code seems to use any image attached to the page or post and present it as featured image. Shouldn’t it only display if a featured image is selected?

    • Matthew on July 27, 2016 at 2:09 am

      Thank you for pointing that our Ricardo.

      I’ve been working with this code on my redesign and now I’m concerned that it’ll display any image when I activate the child theme on my live site.

      How would I go about setting it so that it only injects the image if there’s a featured image selected?

      Thank you once more.

      • Neil Gowran on July 27, 2016 at 2:50 am

        You can add onto the conditionals
        if ( is_singular() && ( true === $add_single_image ) && has_post_thumbnail() )
        Then when in single post view it will only feature the image if it is set as a featured image.

Leave all Comment