Squarespace 7.1 Fluid Engine Builder
Squarespace recently released a new and exciting content editing experience for Squarespace 7.1 named Fluid Engine.
If you’re feeling totally overwhelmed with this big change, you’re in the right place. In this post we dive into what is Fluid Engine, why we love it and how you can use it. For the visual learners out there, make sure to watch the video to get a better idea on how to use the builder!
All our Premium Squarespace templates have been updated to Fluid Engine as of July 2022.
So, what is Fluid Engine?
Fluid Engine is the new editor for Squarespace 7.1 websites.
The builder uses a grid based system, which means there’s a lot of flexibility and opportunity for new layouts in Squarespace. The previous editor couldn’t necessarily be defined by “drag and drop” — as you couldn’t add elements around a page without disrupting other blocks in the process.
Fluid Engine is a grid-based system, and now supports an easier drag and drop experience similar to Showit or Canva. You can layer elements, resize blocks by dragging the corners and have ultimate control over your website design with a lot less custom coding.
The new builder is not available for Squarespace 7.0, and Squarespace has no plans to include it. If you’re still working with Squarespace 7.0, it might be time to consider upgrading.
What we love about Fluid Engine
1) IMPROVED DESIGN FLEXIBILITY:
Layering elements:
We can now layer elements without custom code (so many possibilities!)
Full page control:
Elements can now span to the edge of the section — we love a good full width section!
The capability to move elements forward or backwards:
Ultimate control on what design elements are at the forefront of the page.
Moving blocks without disrupting other elements:
Just drag and drop, it’s that easy!
SHOWCASED: MONDAY TEMPLATE
Resizing elements is done by dragging the corners:
More freedom with block sizing and placement.
SHOWCASED: BIJOUX TEMPLATE
Fill setting on images:
This feature fills the image to the block height and width — no cropping necessary.
No more need for spacer blocks:
Queue Lizzo About Damn Time 🎶
The ability to move multiple blocks at a time:
Being able to click and drag to highlight multiple blocks and then move them all is SUCH a time saver. To move multiple blocks, hold down the shift key and select the blocks — now move them as a group wherever you want!
SHOWCASED: BIJOUX TEMPLATE
2) ADD BACKGROUND COLOR TO TEXT BLOCKS:
Fluid Engine now has an option to add a background to text blocks. It’s a game changer for legibility. To add a background to your text, click the pen icon, tick “background” and update settings if needed.
SHOWCASED: SOCIAL TEMPLATE
3) INDEPENDANT MOBILE LAYOUT:
With The Fluid Engine release in July 2022, we now have more control over our mobile website than ever with Squarespace.
Before Fluid Engine, Squarespace websites were automatically responsive, which means the mobile version of your website is already made for you. Amazing! But with the Classic Editor, you couldn’t really edit it either, which wasn’t ideal in many situations.
Now we can now drag and drop elements similar to the desktop layout. The changes you apply to mobile will generally not update your desktop layout. There are a few exceptions like text and button alignment.
With the purchase of a template, the mobile layout will already be designed for you. Updating the images and text on desktop will also update the content on mobile.
How do I switch to Fluid Engine?
All our Premium Squarespace templates have been updated to Fluid Engine as of July 2022.
Fluid Engine is not available for Squarespace 7.0 websites.
Brand new websites (from July 2022 onwards) will have it enabled automatically. So if your website is very new, you’ll likely have Fluid Engine by default.
If you currently have a Squarespace 7.1 website:
Any new sections you create will use Fluid Engine automatically. If you want to convert your existing sections/pages to Fluid Engine, follow these steps:
Hover over the new section and click Upgrade.
You should now see a grid when you hover over the section, as well as some other small changes to the editor.
Start editing your section with Fluid Engine, repeat for every section.
Please note that converting a section to Fluid Engine is irreversible. We suggest creating a new page and playing around with Fluid Engine before making the permanent decision to convert all your existing sections.
To wrap up, we are big fans of the new Fluid Engine builder! We feel it’s pushing Squarespace in the right direction and actually making the website-building experience more intuitive and freeing…whether you’re a designer or a DIYer.
All of our Squarespace Templates have been adapted for the new Fluid Engine! In the template process we walk you through the new Fluid Engine and everything you’ll need to know to customize a template and more within the new 7.1 Fluid Engine editor.
More tutorials
PIN THIS TUTORIAL FOR LATER!