
Code: https://www.will-myers.com/articles/testimonial-slider-with-an-auto-layout-section
Squarespace Plugins: https://www.will-myers.com/products
In this tutorial, Iโm going to give you some code so that you can build this on your website, with the option to change a bunch of settings.
Letโs gooooo ๐
Timestamps:
0:50 โ adding an auto-layout carousel section
1:55 โ remove images & buttons
2:38 โ basic carousel styling
3:09 โ position the arrow buttons
3:30 โ basic carousel item styling
4:00 โ add in your testimonials
4:22 โ add in testimonial attribution (span)
5:24 โ paste in the CSS (link above)
6:07 โ target the section
7:05 โ adjusting the css variables
7:18 โ adjust coloring
8:10 โ adjust testimonial bubble padding & border-radius
8:58 โ adjusting height of testimonial
9:35 โ pointer arrow
9:58 โ title & attribution spacing
10:23 โ font styling
Heather Toveyโs Squarespace ID Finder:
https://chrome.google.com/webstore/detail/squarespace-id-finder/igjamfnifnkmecjidfbdipieoaeghcff?hl=en
More Articles & Tutorials: https://www.will-myers.com/all-resources
Donate: https://www.buymeacoffee.com/willmyers
Learn CSS: https://www.will-myers.com/learn-css-in-squarespace