Jump to content

How do you automate a hero slide show in Squarespace 7.1

Recommended Posts

  • Replies 3
  • Created
  • Last Reply

Top Posters In This Topic

On 6/18/2022 at 5:45 AM, tommb said:

Site URL: https://www.upcyclepianocraft.com/

Hi there, I've added a slide show of hero shots to my home page and I'd like to get them to advance automatically but there's no setting for that. I'm kinda surprised! Is there a way to do this in 7.1?

Add to Settings > Advanced > Code Injection > Header

<script>
	(function docReady(fn) {
	// see if DOM is already available
	if (document.readyState === "complete" || document.readyState === "interactive") {
		// call on next available tick
		setTimeout(fn, 1);
	} else {
		document.addEventListener("DOMContentLoaded", fn);
	}
})(() => {
	if (window.location == window.parent.location) {
		const reelControls = document.querySelectorAll('.user-items-list-banner-slideshow__arrow-button--right');
		reelControls.forEach(reelControl => {
			(function reelTimer() {
				setTimeout(() => {
					reelControl.click();
					reelTimer();
				}, 2000); // change this value to change the speed
			})();
		})
	}
});
</script>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 3 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.