Squarespace Sections Guide for Custom Page Layouts

Learn how to enhance your Squarespace pages by effectively managing sections for optimal layout and performance.

Squarespace Sections Guide

TL;DR:

  • Add, delete, and rearrange sections to build custom page layouts
  • Choose from block sections, auto layout sections, and collection page sections
  • Edit sections on desktop or mobile, though desktop has more features
  • Save sections for reuse across your site to maintain consistency
  • Keep sections to 20 or fewer per page for best performance

Squarespace builds pages by stacking sections vertically. You can add, delete, and rearrange these sections to create exactly the layout you want. Here's how to work with them effectively.

Adding and Editing Sections

On Desktop:
Navigate to your page and click 'Edit'. You'll see 'Add Section' buttons above and below existing sections. Click one to browse pre-built sections or start with a blank one.

On Mobile:
Tap the 'Edit' icon, then use the '+' button to add sections. Mobile editing is more limited than desktop, but you can still handle basic styling and positioning.

Types of Sections

Block Sections
The most flexible option. Fill these with different content blocks like text, images, and buttons. Perfect when you need a custom layout.

Auto Layout Sections
These create dynamic lists or galleries that adjust automatically as you add content. Great for portfolios or product showcases.

Collection Page Sections
Designed for specific page types like blogs or portfolios where you need to display items in a structured way.

Keep your page performance in mind. While you can add unlimited sections, stick to 20 or fewer per page to avoid slowdowns.

Key Features

Fluid Engine vs Classic Editor
Fluid Engine gives you flexible grid layouts with overlapping elements. Classic Editor keeps things simple with straightforward block arrangements. Choose based on your comfort level and design needs.

Saving and Reusing Sections
Once you've designed a section you like, save it. You can then reuse it across your site, which keeps things consistent and saves time.

Auto Layout Swapping
If you're using Fluid Engine sections, you can quickly try different arrangements with the layout switch feature.

FAQs

Can you add unlimited sections to a page?
Technically yes, but keep it to 20 or fewer for optimal performance.

Can you move content blocks between different section types?
Only between similar section types. You can move blocks between classic editor sections, but not between different engines like Fluid and Auto Layout.

How do you customize a section's appearance?
Click the 'Edit Section' button to access design options, background settings, and color choices for that specific section.

Jargon Buster

Fluid Engine – Squarespace's newer editing system that allows flexible, overlapping layouts

Auto layouts – Pre-made layouts that automatically organize your content

Collection pages – Special pages that display grouped content like blog posts or events

Wrap-up

Sections are the building blocks of your Squarespace site. Once you understand how to add, edit, and arrange them, you'll have much more control over your design. Start simple and experiment as you get comfortable with the tools.

Ready to dive deeper into Squarespace design? Join Pixelhaze Academy for expert tutorials and community support.

Related Posts

Table of Contents