Show Featured Image On Single Post & Page Background

This tutorial for members shows you how to use the Backstretch jQuery script to display a featured image as the background body on each single post or page in Genesis.

If no featured image is chosen, it defaults to the background image you add in the customiser or the default you add for the customiser in your child themes images folder:

There’s several steps you need to take assuming your theme doesn’t include backstretch:

1. Add the main backstretch.js script to your child themes js folder.
2. Add the jQuery which applies the script to the body of each single page and post
3. Load and localise scripts in your child themes functions file.

No need to add a customize.php file as the custom-background function is already included in the customiser by default.

Step 1

Related Templates & Code

• Featured Image As Background Image
• Genesis Page Templates for Background Images