Looking to show more than one image for Front Page 1 section in Digital Pro as a slideshow background? In this article I show how images uploaded to a Soliloquy slider can be set as the source for Backstretch script initialized on .front-page-1 based on my previous Slideshow background via Soliloquy slider using Backstretch in […]
Backstretch
Slideshow background via Soliloquy slider using Backstretch in Genesis
In the past I showed how a single random image can be pulled from images uploaded to a Soliloquy slider and set as body background using Backstretch here. In this article I share the code for getting URLs of all images uploaded to a Soliloquy slider and passing these to Backstretch for full screen slideshow […]
Random image from Soliloquy slider as full-sized background in WordPress using Backstretch
In the comments section of Setting a random full-sized background image in WordPress using Backstretch tutorial, a user asked: Is there a way to make it choose from images in a gallery so that the client more easily add images without having to get at the files? In this tutorial I show how a single […]
How to add support for custom backgrounds in CPTs
If you would like to add support for Custom Background Extended in single entries of a Custom Post Type, say WooCommerce products add the following in your child theme’s functions.php: Back end: Front end: Note: If you are using a theme like Agency Pro which uses Backstretch to display the (same) background image site-wide, you […]
Full screen slideshow in Altitude Pro using Backstretch
In the comments section of How to replace Home Section 1’s background image with Backstretch slideshow in Parallax Pro article, a user asked: I used it on Altitude Pro also and changed “.home-section-1″ to “.front-page-1″ in backstretch-init.js and front-page.php. Awesome – thanks! One question: I used the background: linear-gradient… styling that comes with Altitude Pro […]
Applying Backstretch to multiple Featured images in Genesis
In this article I share how Featured images (if present) linking to corresponding single pages can be displayed above Posts on listing pages in Genesis. Thanks to Luke for the idea that Backstretch’s source can be pulled from data attribute on the webpage. The purpose of this tutorial is only to show how Backstretch can […]
How to show Full width Featured image at the top of Magazine Pro similar to Ambiance Pro
Eric asked, Hey all. I have a site with magazine pro and want to change the single post format to be like ambiance pro. Anyone ever marry up two themes like that our have advice on how to tackle this? Before: After: In this article I share the code taken from Ambiance Pro to display […]
How to set Featured Image as Header’s background using Backstretch in Genesis
In this article I share the code to set Featured image as background for Header using Backstretch in Genesis. This way each Post and Page can have different Header (background) images. Summary: If a Page/Post/CPT entry has a Featured Image attached, use it as a background image for the Header. For Page/Post/CPT entry that does […]
How to replace Home Section 1’s background image with Backstretch slideshow in Parallax Pro
In this article I show how the first home section’s Parallax background can be replaced with rotating images with fading transition when using Parallax Pro. Live Demo Summary: Exclude Featured Section 1 from theme customization section. Exclude Home Section 1 from getting the background image CSS applied. Enqueue Backstretch and initialize it on Home Section […]
How to display Page Title on full-width Featured Image in Genesis
In this article I provide the code to relocate entry title above content and place it in a custom div followed by using Backstretch to apply the Featured image as background to that div for static Pages. Titles will continue to appear normally for Pages that do not have a Featured image set. Step 1 […]
Recent Comments