In this post, i’ll show you how to display your featured image in any hook position in any theme.
You can link your image to:
- The image file.
- Or to the permalink of your page or post.
Please copy ALL the code from the view raw link and paste it at the end of your child themes functions.php file using a text editor like Notepad++
The code assumes you have already set a featured image on your Edit screen.
Link Featured Image To Permalink
Link Featured Image To Image File
With Fallback Image
In case a post or page hasn’t been set with a featured image, you can add a fallback to to child themes images folder.
Styling
Both the above examples include the alignright class which you can use in your style sheet like this:
.single .alignright {
border: grey 5px solid;
}Or you can change the alignright class in the PHP code to a unique class and add your own CSS in your child themes style.css file.
Another option is to replace the alignright class with an existing image class already included in your style sheet.
About The Code
The code includes the thumbnail image size which can also be changed to any size you have set in your Settings > Media.
You can also add a custom image size and use the name for that image in the PHP as another option.
Functions
The code uses the following WordPress functions
- wp_get_attachment_image_src
- get_post_thumbnail_id
- get_permalink
- the_title_attribute
- has_post_thumbnail
As well as a genesis hook and conditional tag for single posts.
Genesis Users
You can change the hook in this code to display your featured image in any genesis hook position. Or use any of the code snippets above.