beware the FLUID ENGINE upgrade button!

7th July 2022. IMPORTANT MESSAGE FOR SQUARESPACE 7.1 USERS

Updated 20th July 2022.

Fluid Engine from Squarespace was gradually released to more and more Squarespace 7.1 websites and now 100% of 7.1 Websites have Fluid Engine either by default on new sites, or as an option to upgrade on existing sites.


BEWARE OF THE UPGRADE BUTTON

Squarespace announced that Squarespace 7.1 websites that were started prior to the launch of Fluid Engine would not be forced to use it before they were ready. That is true, but there is a button that you should not click unless you are ready to embrace Fluid Engine.

If you click this button you irreversibly convert your section to use the fluid engine. This means that you could inadvertently make sections work in a different way, and potentially fail on mobile devices. The order of elements on mobiles is determined by the order you added them - which might not be what you want.

Our Advice: Please understand the implications before making big changes to your live website.

Update 20th July 2022

CHECK MOBILE VERSION/VIEW

On sites in Squarepsace 7.1 there is now an update button for the section. If you have already updated a section to use Fluid Engine, CHECK THE MOBILE VIEW.

In Fluid Engine, elements in the mobile version of the site are added in the order they were created. This might be what you intend. But it might also create odd groupings of page elements that you did not intend…Click the mobile icon at the top of the screen to review.

If your mobile version is broken by the change to Fluid Engine, you can drag and drop the items into the order you want them and alter the spacing.

Our advice:

  1. There is no notion of backup or of staging or development environments in Squarespace consumer sites, so the best thing you can do is to copy a page to a hidden area and not enable it.

    • Copy pages before making changes to understand the implications. Work on the copied page and then test this page. This is a rehearsal to give you confidence that you can then make the changes to the live page.

      or

  2. Create a section, on a hidden page, or use and old hidden page to test the impact of ‘upgrading’ to Fluid Engine so that you understand the implications before editing your live visible pages.

  3. NB It is especially important if you used custom CSS in your build that you are very cautious about thorough testing before upgrading.

CHECK CSS CODE INJECTION WORKS

Your website might have some custom CSS to control how certain aspects look and work. A lot of controls in Squarespace can be done with the user interface, but some require a bit of custom code work. This is especially true if you hired a designer to build your website.

To check if your site has CSS code injection, from the Squarespace Menu >> DESIGN >> CUSTOM CSS. If there is content in the editable part of this area then your site uses custom CSS. Do not delete or edit this code unless you are sure of the implications.

It is possible that pre existing CSS might fail to work in Fluid Engine sections. ie in Classic Sections that are upgraded.

Don’t panic… it might also be fine! But it would be prudent to test and check before implementing wholesale changes to your website.

There are many positives with the changes - but as always with a live site - it pays to be cautious and deal with unexpected consequences before they impact on your live website, where possible.


Email Chris if you’d like some input from Isoblue.


The video below explains why.

Please watch the video below which explains why being cautious for a week or two might be sensible. This means that the section will use the new editor and you will need to learn how it works to make updates to the section. It cant be changed back.

 
 

If you need help urgently, please contact us via our contact page.




Chris Bampton

Chris is a business analyst, consultant and designer.  He loves solving problems and sharing his enthusiasm to help other businesses solve critical problems.

https://www.isoblue.com
Previous
Previous

Rolls Royce Design

Next
Next

What is the difference between a Brand and a Logo?