In this tutorial, we shall replace the single background image for Front Page 1 section in Infinity Pro with a set of images uploaded to a Soliloquy slider (free or commercial) and displayed with a fading effect one after the other, cycling via Backstretch.
If Soliloquy is not active or if a slider named "Front Page 1" is not present in published status, the default background image (bg-1.jpg, changeable via the customizer) will continue to appear.
Create a slider named
Front Page 1 and upload/select the desired background images. Since we are going to just use it as an easy way to manage the background images, settings in Config, Mobile and Misc tabs do not matter and need not be configured.
Upload jquery.backstretch.min.js to
Create a file named say, backstretch-set.js in the same location having the following code:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.