Genesis child themes do not have any option by default to display the featured image on single posts.
While this might be really easy to implement for developers by adding a few lines of code, those of us uncomfortable with code will need to search for suggested code snippets to display featured images.
Having started to use the Genesis framework recently, displaying featured images has become one of my must-add code snippets to the Genesis child themes.
If you are also looking for ways to use featured images in your Genesis child themes, follow along with this short tutorial.
Please note that these tips are only for Genesis Framework themes from StudioPress.
Featured Image on Single Posts
Wouldn’t it be really easy if the featured image that we assign for a post appears automatically on top of the post?
Most of the blogs display their featured images on top of their posts and this has been one of the must-have features in WordPress themes.
To have the featured image automatically appear on single posts, add the below code snippet in your functions.php file of the child theme. (please make sure you are comfortable editing the code and do NOT edit your file on live server.)
Steps adding Featured Image
- Go to Appearance > Editor > Theme Functions (functions.php)
- Add the below lines of code in the file.
https://gist.github.com/pradeepdotco/38fa219f25813afe3531
- You should now have featured images automatically appear in all of your single posts.
Featured Image on Homepage and Archive Pages
Besides, if you are looking to display the featured image on your homepage or your content archive pages, most of the child themes should have this option included by default in your theme settings.
So, follow the steps below to enable this feature via theme settings.
- Go to Genesis > Theme Settings
- Under Content Archives section, define the settings that you prefer (see screenshot below).
Add New Featured Image Sizes
As you can see in the above settings, there’s only a limited option for displaying a featured image in the sizes you want. What if you want a totally different sized image for your featured image?
- Go to Appearance > Editor > Theme Functions (functions.php of child theme)
- Add the below lines of code in the file.
https://gist.github.com/pradeepdotco/c446bed680b1562285c2
Display Featured Image for Genesis Plugin
Although no official plugin exists from StudioPress for featured images, there’s a third party plugin that has a lot of options to add, display and configure featured image settings.
You can download the Display Featured Image for Genesis plugin here.
The plugin adds a lot of options including;
- Display default featured image for all of your posts/pages
- Adding your featured Images in your RSS Feeds
- Add custom styling to featured images
- Several additional filters to allow developers customise the output and have more control.
Steps to add Featured Image Using Plugin
- Download and install the Display Featured Image for Genesis plugin.
- Once activated, from your dashboard go to Appearance > Display Featured Image Settings
- You should now have the option to add featured image on per post basis. You can set up sitewide settings for featured images from this settings page.
- I recommend setting up a default featured image for your website and selecting the option to add featured images to your feed.
If you decide to use the plugin, the plugin might/might not look great simply out of the box. If you are not happy with how it looks, make sure you check out the FAQ section of the plugin that has lot of filters to help you customise the way you want.
Displaying Featured Images below Title with Plugin
One feature that I see most people asking for after installing the plugin is to have their featured images displayed below the post title. This filter is easy to add after installing the plugin but you will need to be comfortable editing your functions.php file.
If you are comfortable editing the code (don’t do on a live server, please), go ahead and add this code snippet in the functions.php file of your current Genesis theme.
https://gist.github.com/pradeepdotco/09737b58bf22bf7f9b39
While a plugin can be convenient if you are looking for additional options for featured images, I suggest learning to add the code snippet manually if you just want to add simple features.
I hope the tutorial helped you to add a featured image in your Genesis child themes. Let me know if you have any questions in the comments below.
