Chykalophia Docs

Understand how Squarespace pages are built from sections and blocks, and learn how to add, move, and delete them.

Every Squarespace page is built from two main components: sections and blocks. Once you understand these two things, editing any page becomes much simpler.

Quick summary

A section is a horizontal band of content on your page, and sections stack on top of each other. Most sections hold blocks: the individual pieces of content like text, images, buttons, and forms. You can add, move, duplicate, and delete both sections and blocks.

What is a section?

A section is a horizontal band of content. Most pages are made up of several sections stacked on top of each other — for example:

A hero section (large image with headline text)
A services section (text and icons)
A testimonials section
A contact section

Sections give your page its structure. You can change the background of each section independently: a color on any section, or a background image on most of them.

Fluid Engine and classic editor sections

Sections that hold blocks come in two kinds. Fluid Engine sections are the default on version 7.1: they show an Add Block button in the top-left corner when you're editing, and a grid appears when you drag blocks. Older classic editor sections have no Add Block button; you add blocks with + icons on the page instead. A classic section shows an Upgrade button that converts it to Fluid Engine. Your layout may shift slightly, and once you save the page, the upgrade can't be reversed. If you change your mind, click undo before saving.

What is a block?

A block is a single piece of content inside a section. Squarespace has many block types:

Block type	What it does
Text	Paragraphs, headings, formatted content
Image	A single photo
Video	An embedded video
Button	A clickable button
Gallery	A grid or slideshow of images (on version 7.1, only in places like blog posts and events; regular pages use gallery sections instead)
Form	A contact or signup form
Map	An embedded Google Map
Social links	Links to your social media profiles
Code	Custom HTML or script (leave to Chykalophia)

You can add multiple blocks inside one section. Where they sit is controlled by the section's grid.

Adding a section

Open the page editor (see How to edit a page).

Hover over an existing section and click Add Section above or below it. On a blank page, the button appears in the middle of the page.

Choose a section. Click a category to browse pre-built layouts, or click + Add Blank, then Section, for an empty one.

The new section is added. You can edit and style it straight away.

Adding a block

Hover over the section and click Add Block in its top-left corner. In a classic editor section, click a + icon instead.

Choose a block type from the menu, or search for one at the top.

The block is added with placeholder content. Click it, then click the pencil icon (or double-click the block) to edit it.

Moving and rearranging

Move a block — hover over the block until the cursor becomes a hand, then click and drag it to a new position. To move a block into a different Fluid Engine section, copy and paste it. In classic editor sections, you can drag a block into another classic section on the same page. Blocks can't be moved to a different page.
Move a section — hover over the section and click the ↑ or ↓ arrow in the section's toolbar to move it up or down the page.

Deleting a section or block

Click the block to select it, or hover over the section.

Click the trash can icon in the block's or section's toolbar. For a block, you can also press Delete on your keyboard.

Confirm the deletion if you're asked to.

Deleting a section deletes all its blocks too

When you delete a section, all the blocks inside it are deleted as well. Make sure you don't need any of the content before deleting. You can use undo while you're still editing, but once you save, a deleted section can't be restored.

Common questions

Can I have blocks side by side in the same section?

Yes. In a Fluid Engine section, you can place blocks anywhere on the section's grid, side by side or even overlapping. In a classic editor section, dropping a block beside another one creates columns.

Why can't I move a block where I want it?

It depends on the section. In classic editor sections, the layout rearranges itself to fill empty space, and blocks can't overlap. In Fluid Engine, moving a block can nudge the blocks around it to keep the layout balanced. Some sections, like auto layouts, gallery sections, and blog or store sections, don't use blocks at all. Ask Chykalophia if you need a specific arrangement.

What's the difference between a section and a page?

A page contains multiple sections stacked vertically. A section is one horizontal row on that page, containing blocks. Think of a page as a book, sections as paragraphs, and blocks as sentences.

Need a hand?

If you're stuck, email support@chykalophia.com and we'll help. Include your website address and a screenshot if you can.

Sections & blocks explained