Jump to content

Fluid Engine: spacing

Go to solution Solved by CassAggett,

Recommended Posts

6 hours ago, Horizonte said:

P.S.

This changes the web style for all pages. But I only want to edit one. So I will have to find a different solution. Anyway, thanks Cass.

Yes the site styles version does affect all pages.

You might like to try the instructions on this page to target just a single section:

https://www.thestyledsquare.com/blog-content/how-to-create-a-full-width-section-in-squarespace-71

If this helped you, please like or mark my solution as answer so others can scroll to it quickly 👆

Cass Aggett is a Squarespace website designer for go-getting women – no matter what stage of business.

WEBSITEINSTAGRAM

 

Link to comment
  • 2 weeks later...

@Horizonte From what I can tell, the code looks right. If you refresh the page and go back into the editor, does it still look this same? (assume so if that's the second screenshot).

Can you share a link to this page?

If this helped you, please like or mark my solution as answer so others can scroll to it quickly 👆

Cass Aggett is a Squarespace website designer for go-getting women – no matter what stage of business.

WEBSITEINSTAGRAM

 

Link to comment

Hi Cass,

yes strange. First I thought maybe its the copy. But than tried the same with the original. I had to set a password, because it is a copy and Squarespace wants me to buy it, to make it public.

https://falcon-owl-schx.squarespace.com/orte/neues-portfolioelement

Password sent by pm

P.S. 

Here the link to my original website 

https://ulibortz.squarespace.com/

If you are wondering why it looks like this, without the creative background. No idea.

image.thumb.png.07cd3947f33a3d4788270494920d3df5.png

Edited by Horizonte
Link to comment

@Horizonte Ahh I've worked it out - that code must be for Classic Editor sections.

I've just tried this code on a demo site and it works (you'll just need to replace the section IDs with your own) :

// FULL WIDTH SECTION

section[data-section-id="652df1bbf4bc4b6dfbfa2e49"] {
overflow-x: hidden !important;
overflow-y:hidden !important;
}

section[data-section-id="652df1bbf4bc4b6dfbfa2e49"] {
.content-wrapper  {
  padding: 0px !important;
  margin: 0px auto;
  display: contents;
  }
  .fluid-engine {
    --sqs-site-max-width:100vw;
    --sqs-site-gutter:0vw;
  }
}

image.thumb.png.2ae9462fe338bed248cbbf8048d165df.png

Edited by CassAggett

If this helped you, please like or mark my solution as answer so others can scroll to it quickly 👆

Cass Aggett is a Squarespace website designer for go-getting women – no matter what stage of business.

WEBSITEINSTAGRAM

 

Link to comment
On 10/17/2023 at 4:36 AM, CassAggett said:

Ahh I've worked it out - that code must be for Classic Editor sections.

 

Hi Cass, I haven't had time to check it out yet. But I had to watch a video first to understand what you mean by this, the Classic Editor. Never used it before with the new fluid engine. Will report later when it is done.

Regards Uli

Link to comment
  • Eunice_SQSP changed the title to Fluid Engine: spacing
On 10/20/2023 at 1:54 AM, Horizonte said:

Hi Cass, I haven't had time to check it out yet. But I had to watch a video first to understand what you mean by this, the Classic Editor. Never used it before with the new fluid engine. Will report later when it is done.

Regards Uli

The Classic Editor is only on use by default now in blog posts and the store items 'additional info' section - they're the only pages/sections that don't have access to Fluid Engine (the editor that shows the grid when you move items around!)

If this helped you, please like or mark my solution as answer so others can scroll to it quickly 👆

Cass Aggett is a Squarespace website designer for go-getting women – no matter what stage of business.

WEBSITEINSTAGRAM

 

Link to comment
26 minutes ago, CassAggett said:

The Classic Editor is only on use by default now in blog posts and the store items 'additional info' section - they're the only pages/sections that don't have access to Fluid Engine

…not forgetting Events 🙂

Me: I'm Paul, a SQSP user for >18 yrs & Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL. We provide high quality original extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is completely free. You can thank me by selecting a feedback emoji. Buying a coffee is generous but optional.

Link to comment
On 10/21/2023 at 9:12 AM, CassAggett said:

they're the only pages/sections that don't have access to Fluid Engine (the editor that shows the grid when you move items around!

Hi Cass, hi Paul, I think I have it now. But what I don´t understand is, why the grid can be seen on your screenshot, though it should be the Classic Editor.  When I am in Classic mode there is no grid. Or is it meant like this? Classic mode, insert css, update to fluid?

But anyway. Working with the classic editor has shown me that I do not miss it 😉 It would be nice if squarespace could implement more flexibility in the spaces. Or just bring back the ability to use css for it.

So I will stick with what I have. I learned a lot and appreciate your help.

Regards Uli

Link to comment
On 10/22/2023 at 9:01 PM, Horizonte said:

Hi Cass, hi Paul, I think I have it now. But what I don´t understand is, why the grid can be seen on your screenshot, though it should be the Classic Editor.  When I am in Classic mode there is no grid. Or is it meant like this? Classic mode, insert css, update to fluid?

But anyway. Working with the classic editor has shown me that I do not miss it 😉 It would be nice if squarespace could implement more flexibility in the spaces. Or just bring back the ability to use css for it.

So I will stick with what I have. I learned a lot and appreciate your help.

Regards Uli

Ah sorry, so what I meant was the code I initially linked you to was for the classic editor which is why it wouldn't have worked on yours that was fluid engine (with the grid).

Mine's fluid engine as well, but with the new code was able to get it to work 😊

If this helped you, please like or mark my solution as answer so others can scroll to it quickly 👆

Cass Aggett is a Squarespace website designer for go-getting women – no matter what stage of business.

WEBSITEINSTAGRAM

 

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.