This tutorial & plugin have been updated. Watch the updated video here: https://youtu.be/grMstxaUBkQ
=========================================================================
Code Available Here: https://www.will-myers.com/articles/super-easy-image-slider-in-squarespace-71-squarespace-70-brine-template
Newsletter Signup: https://www.will-myers.com/newsletter
==========
Enhance your website – Shop the Plugin Store
https://www.will-myers.com/products
Grow Your Skillset – Learn CSS for Squarespace Course
https://www.will-myers.com/learn-css-in-squarespace
===========
This is an update to my previous image slider plugin. I’ve rebuilt this from the ground up to be more integrated with Squarespace’s platform, simpler to install, and with a paid version that auto-transitions the slides.
Features:
✓ No HTML or CSS needed (Only 8 lines of code)
✓ This plugin works in Squarespace 7.1 and in Squarespace 7.0 (Brine Template using Index pages)
✓ Edit Squarespace normally, no code blocks
✓ Sliding Transitions
✓ Simple editing using blocks
✓ Mobile Friendly
First, I built this plugin to be seamlessly integrated with the Squarespace editor. With my other slider, you had to be pretty comfortable with HTML and CSS to customize it. Any additional elements your wants to add to each slide – an image, button, text – had to be added with HTML & CSS. This slider fixes that.
The way this works is that you build out each slide as a section. Add in a background image, add in a video, text blocks, image blocks, forms, buttons, anything – each slide is just a normal Squarespace section!
Once you apply the code, each of the sections that you want to be slides turn into slides! All you need to do is designate which section number should be the first slide, and which section number should be the last slide. Super simple, super easy.
NOTES:
– You need to have a minimum of 3 slides for this plugin to work effectively.
– Don’t add too much content! This is primarily an image slider, the page height is fixed to the device height. So if you add too much content, the content will overflow and be cutoff. This is a feature, not a bug.
