This tutorial & plugin have been updated. Watch the updated video here: https://youtu.be/grMstxaUBkQ
==================================
Link to website with updated code: https://www.will-myers.com/how-to-make-a-sliding-image-banner-in-the-new-squarespace-71
Link to W3Schools Code Snippet: https://www.w3schools.com/howto/howto_js_slideshow.asp
Get Tutorials In Your Inbox: https://www.will-myers.com/newsletter
Finding the data-section-id: https://www.youtube.com/watch?v=Z6YpoGTuS3k
In this tutorial, I’m going to walk through installing the code necessary to make a full-weight, full-width, sliding image banner that you can put text on top of. Squarespace 7.1 still doesn’t have the background image slider. I’ve taken the base of this code here from W3Schools and adjusted it for Squarespace 7.1.
In general, I’m not really a big fan of image sliders especially at the top of a webpage. The top of your webpage should be reserved for the single most important part of that page, not multiple. It’s also really easy for a guest to miss that it’s a slider. But with all that being the case, many people still like sliders like this, so whatcha gonna do?
Link to old code here: https://www.will-myers.com/how-to-make-a-sliding-image-banner-in-the-new-squarespace-71-old