Jump to content

The problem with Fluid Engine

Recommended Posts

Here's the problem: If you set your images to "Fit" you can't align them. If you align them vertically, the horizontal spacing will be off. If you align them horizontally the vertical spacing will be off. (see attached).

If you set the image to "Fill" instead of "Fit", your images will be cropped very badly across different devices.

It seems the only work around is to create your images to the exact specifications of your chosen fluid engine grid. This requires a huge amount of effort as it means redoing ALL your images and measuring all those little rectangles of the grid. It would be VERY helpful if Squarespace provided some way of measuring! 

 

Maybe there's a way to remove the extra space on the top and bottom of the image frames?

Does anyone know of any way to fix the horizontal spacing when there are stacked images set to "fit"???

Heeelllpppp!!!!!!! thanks 🙂

Screenshot 2023-10-02 at 5.04.31 PM.png

Edited by Martian
Link to comment

Since you're a Circle member you can access the "old" gallery block, which would allow you to have these multiple photos with even gaps without cropping.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment
Just now, Martian said:

Do you mean the "Classic Editor"? If so, that opens up a lot of other issues

No, I mean the Gallery Block, you can find it in the new block menu along with all of the other blocks.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

I think that using:

gallery + TEXT + gallery

will work better than this or adding Custom CSS:

image + image + image + image + image + TEXT  + image + image + image

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Do you not see it:

image.png.a7ce679e74bcb0157efde2f5d16bd5ba.png

image.png.c1192007840f71d2c790a875cdb2dcf9.png

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

What do you mean? You can resize it the same as any other block.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

@Ziggy ok, so I created a "stacked" image gallery (and added space between the images with custom CSS)  and think that's a very interesting solve and helps with a lot of the problem. however, I also have videos (native squarespace vids) which can't be put in that gallery block and also have images side by side which can't be put in there either. Thanks Ziggy!

Edited by Martian
Link to comment
21 minutes ago, Martian said:

images side by side

Use the grid instead of stacked.

Videos are more tricky, but worth careful treatment these techniques together should overall improve the look.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.