A user in my Facebook group asked whether it is possible to implement How to display Page Title on full-width Featured Image in Genesis but using a image custom field instead of the featured image.
In this tutorial I show how we can set up a image field using ACF to appear on Posts and Pages. For entries where this image field is populated, we shall remove the entry title from its default location and move it inside a custom div to which the image will be set as background. We are not going to use Backstretch but instead just use the
background-size CSS property with
cover value to make the image stretch full screen.
Pages and Posts in which Entry Title Background image field has not been set will continue to appear as usual:
Install and activate Advanced Custom Fields plugin.
Create a new field group named say,
Entry Meta like this (export file):
Edit/updated your Pages and Posts for which you would like to display the "title header image" and upload/select your desired title header background image.
Add 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.