Does Fluid Engine Remove the Need for Custom Code?
Squarespace new Fluid Engine which was released earlier in 2022 has completely transformed how people create websites in Squarespace 7.1. It allows you to create unimaginable layouts that would previously require a lot of custom code. With the release of such a revolutionary new feature, you might be wondering if there is even a need for custom code in Squarespace 7.1 anymore.
While Squarespace’s Fluid Engine drastically decreases the need for custom code when creating layouts, there are still some situations where custom code is necessary and can achieve things that the Fluid Engine cannot.
Creating Layouts with the Fluid Engine
Squarespace’s Fluid Engine, which was released in 2022 and is only available on 7.1 templates, is a drag-and-drop website editor that gives website designers and non-designers the ability to create more flexible page layouts without code. You can pretty much create any layout that you can imagine with this new way of editing Squarespace 7.1 sites.
It works by adding blocks into a page section, dragging and dropping them into a place on the page relative to other elements in the page section, and dragging the edges to increase the size of each block. You can even customize the mobile views completely separately from the desktop views.
When you consider how the Fluid Engine works, it undeniably removes the need for custom code in some cases. One of the most popular examples is split sections in Squarespace 7.1. Split sections consist of 2 symmetrical blocks that each take up half of the page, and they were impossible to achieve in Squarespace 7.1 before the fluid engine; in fact you can find dozens of blog posts prior to 2022 with code snippets that show you how to do this. With the Fluid Engine, you can easily create split section layout by resizing image blocks and text to fill half of the page. See the image and short video snippet below to see this in action.
Example of Split Section Layout Using Custom Code
Creating a Split Section with Fluid Engine - No Code Required
Fluid Engine Limitations & How Custom Code Can Pick Up the Slack
As beneficial as the Fluid Engine is when creating breathtaking layouts without code, there are still some things layout-related and non-layout-related that cannot be achieved with the Fluid Engine, but that can be achieved with custom code.
For example, if you want to add a hover affect to your navigation links, you need custom CSS. If you want to modify how your buttons look in a way that is not offered natively in Squarespace, you need custom CSS. If you want to add some reveal-text-on-hover affects to your gallery block images, you need Custom CSS. If you want to make all gallery blocks display as 1 column on mobile devices, you need CSS. Issues similar to the ones I just listed are all things that custom code can solve, and that the Fluid Engine cannot solve.
There is also the issue of trying to create more complicated layouts using Fluid Engine. It may seem easier to just drag n’ drop the elements on the page where you want them to be, but it gets more complicated when you want to modify the design, especially on mobile views. It can get time-consuming to have to drag n’ drop every single element into a particular design, and in scenarios like that, custom code really comes in handy.
For more advanced coding solutions that are compatible with the Fluid Engine editor, make sure to visit my plugin & code snippet store, where you can find a collection of coding solutions to enhance your website.
