This code enables you to display your featured image, full width, after the header, on single posts. If no featured image is added, a default image named default.png is displayed which you can add via the customizer and/or child themes images folder.
Here’s what the image looks like tested using the Infinity Pro child theme by StudioPress :
Here’s the demo video showing the responsiveness of the image regardless of size on different sized screens :
Video Demo
Shows the default image added via the customizer displaying after the header when no featured image is added to a single post. Shows the image display full width on all screen sizes.
Code Installation
There’s 3 simple steps once you have access to the files in the download folder :
Step 1 : From the download folder, upload the file named single to your child themes root directory.
Step 2 : From the download folder, upload the folder named image-script to your child themes root directory.
Step 3 : From the download folder, copy & paste the CSS to the end of your child themes style.css file and modify the value for the height property to suit your own requirements.
You can then set a default image using the Featured Image setting in the customizer.
Register or login to access the download folder for members :
Was This Tutorial Helpful?