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:
- Add the main backstretch.js script to your child themes js folder.
- Add the jQuery which applies the script to the body of each single page and post
- 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
Hey Brad,
can this tutorial be applied to WooCommerce single product page as well?
I was thinking it could be cool if the featured product image was used as body background.
Sure can. Simply use the is_singular(‘product’)) conditional tag
Or you can use the is_product() conditional tag which returns true on a single product page. Wrapper for is_singular.