This code enables you to add the featured image after the header using width:100%;
This displays the image full width regardless of the original image size, covering the entire after-header div in any Genesis child theme.
The solution also enables you to add a fallback image using the customize > After Header setting added using the code in the download folder.
On top of that, this tutorial extends the functionality in this tutorial by enabling you to add a different image which can be displayed at any screen width which is good for mobiles.
Demo Video #
Shows the responsive featured image after the header in the Genesis Sample child theme by StudioPress.
Installation #
There’s only 2 steps relating to usage of the code in the download folder for registered users.
Step 1 : Add the PHP code from the functions file to the end of your child themes functions file.
Step 2 : Copy & paste the CSS below to the end of your child themes style.css file and clear caching.
You can then add a fallback image named img.jpg to your child themes images folder or and change this image using the customize > After Header setting.
Register or login to access the download folder :
Leave a Reply
You must be logged in to post a comment.