How to create a review slideshow in Squarespace 7.1
Squarespace has recently brought out a new feature and honestly, it's probably one of the coolest Squarespace design features they've released in a LONG time.
While they have been making lots of updates in the last year, some of them leave much to be desired. This new "Auto Layout List" feature, though, is hella cool. Sure, it has a few kinks and ways it could be made better, but overall, it's a huge asset to Squarespace 7.1 websites.
And, today I'm going to show you how to use it to create Testimonial Sliders, which is a really common use that I think these Auto Layout Lists will be used for.
But, you can use them for so much more than that! They are extremely versatile, so if you're wanting to put basically anything into a slideshow, carousel, or slider format, these Auto Layouts will probably do the trick.
If you've been using Squarespace for a while, you probably remember the old "testimonial slider" trick using a "Testimonials" blog and a Summary Block. While this worked, it was one of those annoying "hacks" that just wasn't ideal.
Unfortunately, this new Auto Layout Lists feature isn't available in Squarespace 7.0, so you'll need to keep using the Blog trick to get a testimonial slider.
But for Squarespace 7.1 users, let's get started!
In your Squarespace 7.1 site click EDIT on the page, you want to add the slider to and click the ADD SECTION to add a new page section
When it prompts you to choose a section type, choose List
Choose from ANY of the designs presented on the right, they are completely editable so it doesn't really matter what you start with. But, if you scroll through you'll see all of the different layouts that are possible, amazing right? So many different designs! If you see exactly what you're looking for in those designs, then by all means choose that one. Otherwise, follow along to create a simple and sleek testimonial slideshow.
You can't edit the content of this section on-page like a regular section. To edit the content in the slider, you need to click "Edit Content" at the top right of the section.
This will bring up a panel of multiple design options, along the top you'll see Elements, Content, Design.
Let's start at the end with the Design tab.
Design
In the Design tab, you can choose from 3 different layout designs. Simple List, Banner Slideshow and Carousel.
We have a lot of different design options in the panel and I encourage you to experiment!
For this specific, simple review slider we're going to choose:
Banner Slideshow
Layout Width: Choose any - this doesn't matter unless you want a background image for each Item.
Vertical Padding: Up to you!
Alignment: Center
Infinite Scroll: ON
Show Adjacent Slides: OFF
Style: Make sure to turn the arrows ON and play around with any of the other settings.
Space: You don't really need to alter these settings unless you want to change something specifically.
Elements
Under the Elements tab, you'll see that you can toggle on/off the Section Title, Button, and the Item Image, Title, Body & Button.
For this slider I'm going to turn:
Section Title and Button OFF
Items Image and Button OFF
Items Title and Body ON
Content
The Content tab is where you add your Items (in this case, testimonials!)
To edit an existing item, just click on it.
Click ADD to add a new item.
Add in as many testimonials as you want!
Rearrange the testimonials by clicking and dragging the little dots on the left side of the Item.
You should now have a simple, review slideshow! How easy was that? Like I said, please feel free to play around with the settings and really make this your own!
Auto Layout List Color Settings
The color settings for this section work exactly the same as any other section on a Squarespace 7.1 site.
Click the Pencil EDIT Icon
And just like any other section, click on Colors to change the section Color Settings.
Once you assign a color profile for the section, you change the color of the Arrows and the Item Card if you have them enabled on the section.
Go to Design > Site Styles
Colors > Choose the Color Theme you want to edit
In the settings, scroll down until you find LIST SECTION
There will be three different LIST SECTION color settings:
LIST SECTION SIMPLE
LIST SECTION CAROUSEL
LIST SECTION BANNER SLIDESHOW
Make sure to edit the settings of the one that correlates with the layout you choose in the Design menu at the beginning.
You'll see that you can change a ton of colors relating to your list layout:
And that's a wrap! You now have an amazing testimonial (or, anything!) slideshow that is so easy to create and maintain, and also looks good on mobile! Pretty awesome, right?
For more Squarespace design tips check out some of our other blogs below!
6 must-read blog design tips for Squarespace
5 simple ways to add a portfolio to your Squarespace website
How to connect your Interact quiz with your Squarespace website
Creating an “as featured in” logo bar on Squarespace
If you liked this post, Pin it to Pinterest! 👇🏻
