Squarespace is an amazing all-around website builder. It’s easy for beginners, yet it has plenty of options to satisfy experienced users with technical know-how. However, with its most recent update, Squarespace introduced something even better, it is called Squarespace Fluid Engine. This new editor further simplifies drag-drop for website building.
Table of Contents
What Is Squarespace Fluid Engine?
Squarespace Fluid Engine is a new website editor introduced in June 2022 after, sometimes after the 7.1 updates. It redefines immersive website building with design flexibility. Previously, the elements were limited to sections; however, this new editor allows users to take their creativity to the next level with desired customization. Meaning you can put any design elements anywhere on the canvas. Now, you can not only create a website seamlessly but also change templates easily.
You can make changes to the website and see the result on the go, in real-time.
If you’ve been using Squarespace since before the update, you can switch to the Fluid Engine editor if you are not pleased with the old interface or vice versa. For newly signed-up users, Fluid Engine is the default editor for the front end.
The new Squarespace fluid engine tries to compete with similar editors. However, it falls short on a few things. For example, Squarespace uses a grid system for website editing. Even in the Fluid engine, that system remains the same. So when you move elements, they’ll snap to align— like nodes on vector graphics snap on the grid and axis.
How Does Squarespace Fluid Engine Work?
The fluid engine is exclusive to Squarespace 7.1 and works pretty much like any other WYSIWYG editor. With Fluid Engine, Squarespace introduced an all-new grid system that allows users to drag-drop, overlay, and resize elements.
The new editor doesn’t work with:
- Blog pages
- Event pages
- Product descriptions
| Pros | Cons |
|---|---|
| More flexible and better customizations | Mobile layout requires more editing. |
| No extra charges | Lacks Undo option—can’t revert to classic block once converted to Fluid engine. |
| Easy to switch to the classic editor | Too many options might overwhelm new users. |
| New separate mobile customization option | No customization for tabular devices |
| More robust and versatile |
Squarespace Fluid Engine Review
To create this review of Squarespace Fluid Engine, we spent days testing every feature, tool, and customization, and here’s what we found:
New Grid Design for Editing…with a caveat
Every drag-and-drop builder we have used so far has had some limitations to it. Some didn’t allow moving the elements freely, while others had weird layouts. Squarespace’s new editor comes very close to Wix’s editor. You can read our Wix review to know more about its drag-and-drop editor.
Squarespace had limitations in the classic editor, but that’s not the case with the Fluid engine. Although the Fluid engine has problems, It still is robust, clever, and functions on the grid system. It takes a little getting used to the new layout. But once you get the hang of it, you can create stunning-looking websites.
You can only move the elements within the grid, snapping to align with the small boxes in the background. The section can extend vertically but not horizontally. If you move elements outside the grid horizontally, it enlarges. You can’t resize the element after a certain point (still large). See example:
We put the button outside the box and tried to shrink the padding but it didn’t work. We also couldn’t find any option to change the button’s background alone.
The grid is super helpful for alignment and gives more than enough flexibility to move elements around. In essence, you can control every aspect of the design…within the grid.
Header and Footer
The fluid engine offers header and footer customization on the go. It’s a good option, but we only saw 5 different layouts for the header in our testing.
There’s no drag-and-drop feature for the header, but that feature is available for the footer section. We would have loved to see the header getting the same treatment. There are, however, a few predefined header templates you can choose from. The interface is quite intuitive and takes little time to figure out.
One-click at the header opens up a box on the side; you can change the site title and add a desktop or mobile logo there. You can also customize other elements, such as adding background color or style to the header, removing social media buttons, adding multilingual options, and more.
In the same header editing section, you can change the header style for both desktop and mobile.
The footer offers decent editing options. You can customize the content, rows, alignment, and width. The elements can also be moved around by dragging.
You can also choose different footer styles and add more sections to showcase more information.
Mobile Optimization
Before the fluid engine, optimizing the mobile website layout was difficult and limited in many ways. The classic editor would produce a mobile version of the website from the desktop version. That’s not the case anymore.
Squarespace really focused on mobile editing this time around and is well appreciated. Now, you can click the mobile icon at the top right corner to edit elements for mobile devices.
When you create a desktop website and click on mobile editing, Squarespace will generate a mobile version of the same site, like before. What’s different now is you can change the layout however you like including the background.
Background and Color Palette
If you’re one to focus more on the website’s background, you’re in luck. The fluid engine provides more than enough flexibility to change the background and overall color theme. To access the background editing, hover your cursor anywhere on the screen > Edit section> Format | Background | Colors > Background.
You can use images with different effects for the background and fiddle with the colors to match the whole character of the website. If you like more artistic things, there’s an option to select different art backgrounds as well. To access, Edit section> Format | Background | Colors > Background > Art.
You can click on any available art to see how different they look on your page. There’s also an option to change the color, effects, and filter of the art if the default preset doesn’t match your taste. There are 2 ways to access the theme settings, we found the site styles to be the easy one. Click Save on the top left corner and then click Done.
Shaping Elements
Sometimes you’d want your images or buttons to look specific, for example, buttons with round corners or oval shapes. Similar is the case with images. Squarespace Fuid Engine makes changes to elements easier. Add an image and click on it to edit.
Fit keeps the image in its original format, while Fill stretches it to cover the highlighted section. There are 35 different shapes to choose from. All these features can give your page a distinct personality, making it stand out even more.
Prebuilt Pages And Block Templates
A website needs to provide tons of visual and textual information. This requires putting images, text, and many other elements on the page. With a click, you can easily add different components like sections or blocks on the Squarespace Fluid engine.
Sections come preoccupied with multiple elements such as text boxes, images, buttons, email forms, and more. The idea is to offer rapid development of the website. However, you can use blocks if you want to create a section from scratch. Although store owners may find the products section rather helpful as they don’t have to design it completely, and only need to change the images and the descriptions.
The Squarespace prebuilt sections include:
- Add a blank section
- Saved Sections
- Intro – Hero
- Contact
- About
- People
- Products
- Services
- Portfolios
- testimonials
- Events
- Quotes
- Member Areas
- Appointments
- Donations
- Images
- Videos
- Menus
- Forms
- Charts
- Audio
Sections are especially advantageous for artists, restaurant owners, and online stores. There are separate blocks for images, videos, audio, menus, charts, and forms.
Unlike sections, blocks are individual items like a title box, text box, or a line or contact form. If you want to create a section from scratch, so many block options can prove to be really helpful. The blocks were available in the classic editor too, but they were limited in control, offered lesser settings, and weren’t as flexible as they are now with Fluid Engine.
The best part of the designs is that you’re not stuck with what you get from the sections or blocks; Fluid Engine gives you full control to edit the contents. They can be used as suggestions; on top of it, you can insert elements like images, text, or more.
You can either click on the block or drag a block to add to the section. Later, you can place the blocks anywhere you want within the grid. The Squarespace Fluid Engine has blocks divided into categories so you can easily find what you want.
For example, the Basic block lets you add Buttons, texts, images, quotes, and more. The business block has products, membership signup, and Scheduling. There’s an integration category where you’ll find blocks for social media.
You’ll also find a few premium blocks that will allow adding a menu, a donations box, and integration with Amazon.
Squarespace Fluid Engine: Ease Of Use
The new editor may seem overwhelming to some, but it is as fluid as the name. During our Squarespace fluid engine review, we didn’t just test sections or blocks; we created a complete website.
Building a website is now even smoother and seamless, given the changes the new editor has brought. All you have to do is sign up, buy a plan, choose a template, and start editing. The admin panel is intuitive and easy to navigate through. However, there is a steep learning curve for new people. That said, website building couldn’t get any easier.
One of the website things about Squarespace dashboard is it is clutter-free. You can access both the website and commerce edit front and backend if you have a store or restaurant.
The admin panel to edit the website is also made simple. You can edit pages, including adding or deleting, tweaking the design, and editing your store, including inventory, products, customers, and more.
We have reviewed a ton of website builders, and we confidently claim Squarespace’s dashboard and admin panel is one of the simplest and cleanest.
Squarespace Fluid Engine: Pricing
If are under the notion of Squarespace fluid engine being pricier than a classic editor, fear not. It costs the same. In fact, there’s no separate plan for the Fluid engine. You can subscribe to any plan and you can use the newest editor by default.
Pricing starts at $23/month ($16/month if paid annually) and goes all the way up to $65 ($49/month if paid annually)
The rest of the options are the same as what you previously got with Squarespace before the Fluid Engine release. The Squarespace customer support is the same; you can reach them via email or chat, still no phone support. You can also head to the Squarespace Forum to discuss fluid engine-related topics.
If you need help getting started, Squarespace Help Center should be more than enough. If you still have unsolved doubts, forum, and chat options are always there. If nothing works, you can hire a Squarespace designer.
Conclusion: Is Squarespace Fluid Engine Better?
The Squarespace Fluid Engine is definitely a step up over the classic editor. It gives you more design freedom, like overlapping different elements; this wasn’t present in the classic editor. The new grid system:
- Helps align the blocks on the section.
- New background types, including art animation,
- The color palette is refreshed, and the pages look clean.
- Squarespace also introduced mobile layout editing. Now you can click to edit the mobile layout on the computer.
We would have loved to see an editing option for Tablet devices. Overall, you’re getting a new fluid, a seamless website builder with the same Squarespace goodness and price.
FAQs
How do I change to Fluid Engine in Squarespace?
To change to Fluid Engine In Squarespace, there are two options:
You’ll find an upgrade button in the editor if you’ve been using the website since before the 7.1 update. Click that to use the new editor.
When you add a new section or template, it’ll come with Fluid engine as a default editor. For more details, read this guide.
The sections on your current Squarespace website continue to use the classic editor regardless of your website’s live status.
What is the difference between Squarespace fluid Engine and classic editor?
The difference between Squarespace Fluid Engine and the classic editor is the Fluid Engine replaces Squarespace’s classic editor to offer a better website designing and managing experience. Both editors use drag-and-drop features, but only Fluid Engine uses a grid-style system giving more control over block placement, background customization, and other content options: this makes the website building process faster, seamless, and relatively easier.
How do I turn off Fluid Engine in Squarespace?
To turn off the Fluid Engine in Squarespace, head to add a page> Page Layouts. In the left sidebar, scroll to the bottom to find “Looking for designs built with our Classic Editor?” Click to reveal the old templates, choose and start editing.
