The New Fluid Engine in Squarespace: A Complete Overview

 
 

Fluid Engine, Squarespace’s brand new content editor, is rolling out throughout July 2022, so it’s time to share a full overview. If you have used Squarespace for a while, news of the change may come with mixed feelings, and you wouldn’t be wrong, but overall, this change represents the next phase of modern design within Squarespace. Of course, with all changes comes the good and the bad. 

With Fluid Engine coming online, this will be the biggest change to the Squarespace editor in the last decade. Squarespace recognized that its Classic Editor wasn’t the most intuitive for users used to true drag and drop platforms like Canva. The spacer block, for example, is one of the main creative tools in the Classic Editor, but many users don’t know how to use it in its intended way. Fluid Engine eliminates the need for spacer blockers and instead uses a grid system that is all-around super flexible and easy to use. What is Fluid Engine, how is it different from the Classic Editor, and what do you need to know about the transition? Let’s break it down so you know what to expect with this massive overhaul.

You may have seen this button in the top left corner of your sections. You can click this button if you want all of your sections to switch over to the new editor otherwise only the new sections you add will use Fluid Engine while previously created sections will keep the Classic Editor. For now, I would recommend not clicking this button. Instead, just add some new blocks or create a blank page and play around with it for a bit until you get used to it! Because once you press this button there is no going back!

Pros

Grid System

The grid system allows content blocks to be placed essentially anywhere within a section. With the classic editor, the placement of blocks within sections was limited. Spacer blocks were used to move things around and create negative space. The grid system eliminates restrictions on the location of blocks, providing much more flexibility and creative freedom. Use Command + G (or Ctrl + G) to turn the grid on or off.


Item Overlap

Since the grid system allows blocks to be placed anywhere in a section, this also means that items can overlap easily. Previously, this would take quite a bit of coding to do successfully. Fluid Engine makes overlapping blocks as easy as dragging one block over another. You can also easily change the layering order of blocks.


Full-Bleed Content

Fluid Engine allows designs to stretch all the way to the edge of a webpage, again without the need to use clunky code. This feature allows for beautiful, on-trend designs with easy execution. 

Awesome New Auto Layout Options

You know that pop up that appears when you click add a new section and it has all these pre-made layouts? Well the new layouts with fluid engine are seriously next level! 

Video Block
Double-click here to add a video by URL or embed code. Learn more


Design Separately on Desktop and Mobile

This one is huge! Although Squarespace has always been a responsive platform, meaning it automatically changes sizing of the design based on the size of the screen, it’s inevitable that some design aspects just do not translate perfectly across screen sizes. Fluid Engine allows you to make changes to mobile designs separately from desktop designs, so you can completely customize your designs to fit the screen. Yes!

However, the main pro to Fluid Engine β€” its creative flexibility and freedom β€” can also be its biggest con. 

Cons

Too Much Flexibility

Wait a minute! How can too much flexibility be a con? Perhaps because of its inflexibility, the Classic Editor struck a balance between offering design options but also not overwhelming the user with too many choices. When it comes to design, often less is more. Fluid Engine offers a blank slate, which can certainly present a challenge to the DIY user who benefits from the built-in design guidelines that the Classic Editor offers.

No Image Block Layouts or Animations

For long-time Squarespace users, image block layouts, such as collage, stack, card, and  

overlap, are blatantly missing. Similar layouts can be created with the Fluid Engine tools, but they take longer to create and are more complicated without the pre-existing layouts. Individual image animations are not available, either, which seems like an oversight. Fingers crossed that Squarespace adds that at some point, but of course, there is no guarantee. Thankfully, site wide animations still exist!

It’s Buggy

With any new technology update, it’s common to have bugs or glitches to work through. This isn’t surprising but is certainly something to be aware of. If something doesn’t seem to be working correctly, it may be a bug and unfortunately there isn’t a lot you can do other than wait it out. Fortunately, Squarespace is undoubtedly working hard to clean up the bugs as quickly as possible.

Not available for 7.0 users

Fluid Engine is not available for 7.0 sites, and most likely, it will not be available for 7.0 sites in the future. It has become clear that Squarespace is strongly prioritizing 7.1 and Fluid Engine, and unfortunately, there isn’t currently a simple way to switch a 7.0 site to 7.1 and Fluid Engine. 

What Next?

Squarespace rolled out Fluid Engine to Squarespace Circle members in early July and plans to make it available to all users on July 21, 2022. But, if you have an existing site and you’re not ready to take the plunge quite yet, you can decide whether or not you want to transition to Fluid Engine. You can also β€œturn on” certain sections and not others, so you can take your time with the transition. For new sites, Fluid Engine will be the default editor moving forward. 

All in all, of course Fluid Engine isn’t perfect, but it’s safe to say that it is a step in the right direction. Squarespace will certainly be continually updating and improving Fluid Engine as well, so most likely, it will only get better from here.

If you are struggling with the rollout of the new editor and have more questions - feel free to reach out to me directly! I’m happy to help. Click the help button below :)

Previous
Previous

How to Run an SEO Audit on Your Squarespace Site

Next
Next

5 Essential Elements For Your Homepage