Website Builders

Squarespace Fluid Engine in 2026: What You Need to Know

By Editorial Team Published · Updated

Squarespace Fluid Engine in 2026: What You Need to Know

Fluid Engine is Squarespace’s drag-and-drop page editor. Squarespace’s help center describes it as “the primary editing experience for sites on Squarespace version 7.1”, used in block sections on all page types, in portfolio projects and in the site footer. It replaced the older “classic editor” for those areas, letting you place content blocks anywhere on a section’s grid, overlap them and design a separate mobile layout.

This guide explains how Fluid Engine works, where it is still limited and how to get the most from it. Everything below is based on Squarespace’s own help-center documentation and pricing page, checked on November 1, 2026.

How Fluid Engine Works

Each section of a page has an invisible grid. When you click Edit on a page, a Fluid Engine section shows an Add Block button in its top-left corner, and a grid appears in the background as you drag blocks (press G to keep the grid visible). You can drop text, images, buttons, video, forms and other blocks anywhere on that grid, resize them by dragging their edges, and place them on top of one another. When blocks overlap, the block toolbar’s forward and backward controls decide which sits on top.

Because the layout is grid-based, moving one block can nudge the blocks around it slightly. Squarespace says this happens “to preserve overall balance of the section layout.”

Fluid Engine is available only on version 7.1 sites. Version 7.0 sites use the classic editor throughout, and Squarespace offers an update tool for moving from 7.0 to 7.1. For a wider look at the platform, see our Squarespace review.

Desktop and Mobile Layouts

The most practical difference from the classic editor is mobile control. In the classic editor, changes to the desktop layout carry over to mobile, and columns stack vertically on phones. In Fluid Engine, Squarespace says you can “arrange, resize, style, and hide blocks separately for mobile audiences.”

To edit the mobile layout, click the Mobile View icon in the top-right corner of the editor. From there you can drag blocks into new positions or use the ↑ and ↓ arrows in a block’s toolbar to move it above or below its neighbor. Blocks can be hidden on mobile through the Layers panel, which is useful when a long passage of desktop text would bury the information mobile visitors need. If you add new blocks after customizing the mobile layout, Squarespace places them as close to the desktop arrangement as it can, so review mobile again after each round of edits.

Section Settings That Shape the Grid

Two section style settings control how the grid behaves:

  • Row Count sets the number of rows in the section’s grid, which determines its height. Squarespace notes that this is the only section style option that can differ between the desktop and mobile layouts. The minimum depends on the blocks you’ve added.
  • Gap sets the spacing between blocks in the grid. You can choose no gap, a preset gap, or custom vertical and horizontal gaps.

Each section is its own canvas, so a page can mix a full-width image section, a dense grid of cards and a simple centered text section, each with its own background and styling.

Pinned Blocks

Fluid Engine also supports pinning. According to Squarespace’s help center (updated June 2026), you can “pin blocks to fixed points in Fluid Engine sections to keep them stationary while visitors scroll through other content in the section.” Used sparingly, a pinned heading or image next to scrolling text can make a long section easier to follow.

Upgrading Classic Editor Sections

Older sections on a 7.1 site may still use the classic editor. You can tell because they have no Add Block button or grid; instead you add blocks by clicking + icons. To convert one, click Edit on the page, then Upgrade in the top-left corner of the classic section.

Squarespace gives three cautions. Your layout “may change slightly.” A section taller than Fluid Engine’s 1,000-row grid limit is split into several sections. And it’s not possible to revert an upgraded section after you save the page, so duplicate the section first if you’re unsure, or click Undo before saving.

Limitations to Be Aware Of

Blog posts and products still use the classic editor. Squarespace says “collection items and any block sections added before Fluid Engine’s release use the classic editor.” Collection items include blog posts and store products. Standard pages can have elaborate layouts, but individual posts and product descriptions are more limited. That matters if your site is mostly blog content.

No spacer blocks. The classic editor’s spacer blocks aren’t supported in Fluid Engine. Squarespace’s advice is to create white space by positioning blocks on the grid (and, at the section level, with the Gap setting).

Code access depends on your plan. Basic code blocks (HTML, plain text, Markdown or CSS) work on every plan, but advanced code blocks that run JavaScript or iframes, and site-wide or per-page code injection, require the Core plan or higher. As of November 2026, Core costs $29 a month billed annually. If you need deep control over code, a WordPress setup with a page builder may suit you better; see our WordPress page builders compared guide.

Layout freedom still has edges. Blocks snap to the grid, and moving one can shift its neighbors. That keeps layouts tidy, but it means pixel-perfect placement isn’t the goal. Designers used to fully freeform tools may need time to adjust.

Heavy pages are still slow. Fluid Engine doesn’t change the basics of page weight. Many large images, background videos and embeds will slow a page down on any platform, so check key pages with Google PageSpeed Insights after building them; our Core Web Vitals guide explains what the scores mean.

Who Fluid Engine Is Best For

Service businesses and portfolios. Grid placement, overlap and pinning suit portfolio pages, case studies and service landing pages where layout is part of the message.

Owners of older Squarespace sites. If your site predates Fluid Engine, upgrading sections one at a time lets you redesign gradually. Duplicate each section first, given that upgrades can’t be undone after saving.

Design-conscious users who don’t code. Fluid Engine offers much of the layout control people otherwise get from HTML and CSS, inside a managed platform.

People weighing Squarespace against WordPress. Fluid Engine gives you less control than WordPress with a page builder, but you also get no plugins to maintain and no hosting to manage. Our WordPress vs Squarespace vs Wix comparison and Best Website Builders 2026 roundup cover the wider choice.

Tips for Getting the Most Out of Fluid Engine

  1. Start with sections, not blocks. Plan each page as a series of sections with distinct goals, then add blocks.
  2. Use the grid for white space. With no spacer blocks, leave empty grid cells and adjust Gap to control breathing room.
  3. Check mobile after every section. Fix the mobile layout in small batches rather than all at the end, and hide blocks that don’t help mobile visitors.
  4. Duplicate before upgrading. Copy any classic editor section before clicking Upgrade.
  5. Keep pages lean. Compress images, limit background video and test speed before launch.

Sources

  1. Squarespace Help Center — Edit your site with Fluid Engine — accessed November 1, 2026
  2. Squarespace Help Center — Moving blocks to customize layouts — accessed November 1, 2026
  3. Squarespace Help Center — Design mobile page layouts in Fluid Engine — accessed November 1, 2026
  4. Squarespace Help Center — Style page sections — accessed November 1, 2026
  5. Squarespace Help Center — Pin blocks in Fluid Engine — accessed November 1, 2026
  6. Squarespace Help Center — Spacer blocks — accessed November 1, 2026
  7. Squarespace — Pricing — accessed November 1, 2026