Finkea Design Web Designer

View Original

Squarespace's Fluid Engine: A Game-Changing Update

See this content in the original post

While this is a somewhat late article, this is for those who have been on Squarespace for a while and might not have known that recently Squarespace upgraded their popular editing software to what is being called Fluid Engine.

This significant update addresses the limitations of the previous editing system, now called Classic Editor, which didn't quite deliver on its promise of a seamless "drag and drop" experience. With Fluid Engine, Squarespace introduces a grid-based system that revolutionizes the editing process, offering enhanced flexibility and more diverse layout options. 

It's important to note that Fluid Engine is exclusively available for Squarespace 7.1 websites and is not expected to be offered to 7.0 users.

Let's explore the exciting new features that Fluid Engine brings to the table:

An Improved Drag and Drop Experience

The first notable enhancement is the grid system, which expands the layout possibilities by adding 24 columns instead of the previous 12 used in Classic Editor. This allows for more precise block placement, and blocks are no longer confined to the top of the page. They can be positioned independently, offering greater freedom in designing your website.

Resizing blocks is now easier than ever. Unlike the Classic Editor, where surrounding blocks influenced block sizing, Fluid Engine allows you to resize blocks by dragging their corners to expand or retract. Moreover, Fluid Engine introduces the ability to select and move multiple blocks simultaneously, streamlining the editing process.

The Obsolescence of Spacer Blocks

Fluid Engine eliminates the need for Spacer Blocks, previously used to create gaps and resize blocks. Instead, you can now create space between blocks by not placing them directly adjacent to each other. This enhancement saves significant time and simplifies the layout creation process.

Block Layering

A highly anticipated feature, block layering, is now seamlessly integrated into Fluid Engine. In the Classic Editor, achieving layered blocks required a CSS workaround. With Fluid Engine, you can easily layer blocks on top of each other, enabling the creation of visually appealing collages or overlaying text blocks on images, providing endless design possibilities.

Add Background Colors to Blocks

Fluid Engine introduces a simple yet genius upgrade that benefits DIY website creators greatly. You can now add backgrounds to most blocks with a single button click. This means you can easily create visually appealing text boxes with customizable background colours, enhancing the overall aesthetics of your website.

Fit or Fill Aspect Ratios

Fluid Engine gives you greater control over how images and other blocks fill the space. When you need an image to occupy a specific area but are unsure of its dimensions, you can fill the block with the image instead of shrinking it to fit automatically. This feature also applies to other blocks, like buttons, offering more website design flexibility.

Full Bleed Content

Fluid Engine allows you to create full-width split layouts without plugins or custom CSS. By unchecking the viewport option, the grid expands to the top and bottom of the section, allowing you to achieve stunning full-bleed effects. You can also bleed blocks off the edge of the screen, enabling floating or collage-style layouts.

Separate Mobile and Desktop Editing

While Squarespace websites are automatically responsive, the Classic Editor could not independently edit a website's mobile version. With Fluid Engine, separate mobile editing is now possible, providing greater control over the mobile version without impacting the desktop layout.

This is a significant improvement for ensuring an optimal user experience across different devices. It's important to note that the mobile version populates content in the order.

Fluid Engine Conclusion

In conclusion, Squarespace's Fluid Engine is a game-changing update for Squarespace 7.1 websites. With its grid-based system, actual drag-and-drop functionality, and a wide range of new features, Fluid Engine offers users enhanced flexibility, layout options, and an intuitive editing experience.

Fluid Engine empowers users to create visually stunning and responsive websites without needing custom coding or plugins, from improved block placement and resizing to block layering, background colours, and full bleed content.

For Squarespace 7.0 users, it's recommended to consider switching to Squarespace 7.1 to take advantage of the new features and stay up-to-date with the latest technology. Explore Fluid Engine and unleash your creativity to build remarkable websites with ease.