In a website that I have recently set up for a client, the requirement was to display an image that's not the featured image above the title on single Post pages in Genesis. Since the featured images were being shown in a square proportion on content archives, they weren't suitable to be shown in a rectangular/banner-style on the individual posts. In this tutorial, I show how we can create a field group having a custom image field to be shown on Posts in the WordPress editor. When this field is set, we shall make it appear on the single Posts. If this field is empty, the featured image will be used instead. If neither the alternative image nor the feature image is present, nothing will be output. Also, we shall use native WordPress functions instead of ACF's to remove the frontend dependency. Featured image on content archives like /blog: Alternative image on the single post:
Step 1Let's register a custom image size for the image on single Posts. Add this in child theme's functions.php:
Change the width to match the available content area width on your site. Height is up to you. Regenerate thumbnails if needed.
add_image_size( 'featured-image-large', 650, 340, true );
Step 2Install and activate Advanced Custom Fields. Create a field group named say,
Post Metahaving an image field named
Single Post Image. Set the Return Value to
Step 3Add the following in child theme's functions.php:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.