Add Autoplay to Auto Layout Sections

What You'll Create

Auto-advancing slideshows for your Auto Layout Sections. Your Banner Slideshow or Carousel sections automatically cycle through items at a customizable speed—no visitor interaction required.

The Problem It Solves

Squarespace's Auto Layout sections with carousel/slideshow features require visitors to click arrows or swipe to see more content. There's no native autoplay option, which means potential customers might miss content if they don't interact. Adding auto-advance creates a more engaging, TV-like experience.

Perfect For

Testimonial carousels, Featured portfolio slideshows, Client logo showcases, Hero banner rotations, Product highlight sections

What Makes This Different

This technique uses a lightweight script that adds autoplay to any Auto Layout section you choose. You control the timing by adding a simple tag to your section's title field—change the speed number to make it faster or slower. You can also optionally switch from the default slide transition to a smooth fade effect. The autoplay only activates on sections you specify, so other carousels on your site remain manual.

Details

• Section Type: Fluid Engine

• Code Type: CSS + JavaScript

• Prerequisites: Auto Layout Section with Banner Slideshow or Carousel layout

• Toolkit Title: Autoplay for Autolayouts

Learn This Technique

This is one of 150+ code techniques taught inside Standout Squarespace, where you get:

• The complete, copy-paste code

• Video walkthrough explaining how it works

• The principles behind the technique so you can customize it

• Access to our private community for support