Auto-Layouts for Squarespace 7.1 Explained

Squarespace Auto Layouts are now available as a new section-type for all Squarespace 7.1 websites. In this article, I’m going to review some of my favorite features, as well as point out the differences between the Auto Layout Banner Slideshow and my Pro Section Slider plugin. Let’s dive in.

Creating an Auto Layout Section

You create a new Auto Layout Section the same way you would a normal section. You can only add list section onto a page that allow for well, sections. So this includes any normal page you add, but doesn’t include product pages, blog pages, and event pages (Although the “Collection” page does work for each of these).

Squarespace Auto-Layouts are now available as a new section-type for all Squarespace 7.1 websites. In this article, I’m going to show you an example of the 3 different layouts, review some of my favorite features, as well as point out the differences between the List Slider and my Pro Section Slider plugin. Let’s dive in.

NOTE

This is a new element, so the features that I discuss in this article might be changed by Squarespace in the future.

You create a new Auto Layout Section the same way you would a normal section. By hitting that blue “add section” button in the Squarespace Editor.

You can only add an Auto Layout section onto a page that allow for well, sections. So this includes any normal page you add, but doesn’t include product pages, blog pages, and event pages (Although the “Collection” page does work for each of these).

Currently, there are 26 different layout presets you can choose from. These are presets because each one has the same base features and can be adjusted in the same way (watch me adjust the layout in the video above). So just pick one and get started!

Once you have an Auto-Layout section on your page, you need to add in the List Items. You can edit each List Item on the Content tab of the section editor.

Here are some examples of what each item might be.

• If you’re creating a list of product features, each feature would be a list item

• If you’re creating a slideshow, each slide would be a list item

• If you’re creating a logo carousel, each logo would be a list item

Each List Item can hold an image, a title, a description, and link. You also have the option of adding a Title and Button for the entire section.

You can choose from 3 different layout styles in the design tab.

1. Simple List

2. Banner Slideshow

3. Carousel

Each one of these is pretty cool and unique in its own right, so let’s dive into each of these individually and talk about which situations each of these would be best used.

Changing the fonts and colors is in the Design » Site Styles area. To adjust the colors, click on “Colors” and then the color theme you want to adjust. You can adjust the colors on each layout type from above.

The Simple List is best used when the list items should be the focus for the user. You might not be exactly sure what the user is looking for, so you place all of the items in an easy to see way.

Examples For a Simple List:

• A list of features for a Product or Service

• Testimonials - With focus on highlighting key messages

Below, I’ve built out an example “Simple List” section highlighting features of my video element plugin.