Squarespace Fluid Engine uitgelegd: de complete gids voor 2026

Snel antwoord

Fluid Engine is de drag-and-drop editor van Squarespace 7.1, gelanceerd in juli 2022. Je plaatst blokken vrij op een grid van 24 kolommen op desktop en 8 kolommen op mobiel. Blokken mogen overlappen en de mobiele indeling bewerk je apart van desktop. Tekst en links blijven op beide versies gelijk, de positie en grootte van blokken niet. Fluid Engine werkt in pagina-secties, niet in blogposts.

Fluid Engine versus de klassieke editor

	Klassieke editor	Fluid Engine
Grid desktop	12 kolommen in rijen	24 kolommen, vrij plaatsen
Grid mobiel	Blokken stapelen automatisch	8 kolommen, apart te bewerken
Overlappen	Niet mogelijk	Wel mogelijk
Beschikbaar in	7.0 en 7.1	Alleen 7.1, in pagina-secties
Blogposts	Ja	Nee, blogs gebruiken nog de klassieke editor

Fluid Engine is het onderdeel van Squarespace waar ik de meeste vragen over krijg. Logisch: het geeft je veel vrijheid. En vrijheid zonder regels levert op mobiel vaak een rommeltje op.

Ik bouw sinds 2019 in Squarespace en sinds de lancering in 2022 elke website in Fluid Engine. In deze gids leg ik uit hoe het werkt, wat de officiële regels zijn en welke werkwijze ik zelf gebruik om sites strak te houden op elk scherm.

Inhoudsopgave

1. Wat is Fluid Engine
2. Het grid
3. Mobiel apart bewerken
4. Klassiek omzetten
5. Veelgemaakte fouten
6. Mijn werkwijze
7. Veelgestelde vragen

1. Wat is Squarespace Fluid Engine?

Fluid Engine is de editor waarmee je in Squarespace 7.1 secties opbouwt. Squarespace bracht hem uit in juli 2022 als opvolger van de oude Layout Engine, die werkte met rijen en 12 kolommen. Squarespace beschrijft de techniek zelf op het Squarespace Engineering Blog.

Het grote verschil: je sleept blokken waar je wilt, ze kunnen overlappen en je bepaalt de mobiele indeling zelf. Werk je nog in 7.0? Dan heb je eerst een upgrade naar 7.1 nodig.

---

2. Zo werkt het grid

Op desktop werkt Fluid Engine met 24 kolommen, op mobiel met 8. Elk blok beslaat een aantal kolommen en rijen. Je kunt de hoogte van rijen en de ruimte tussen kolommen per sectie instellen.

Praktische regels

• Houd vaste marges aan: laat tekst bijvoorbeeld altijd op dezelfde kolom beginnen.

• Gebruik de rijhoogte om ritme te maken, niet losse lege blokken.

• Zet de sectiehoogte op 'small' of 'medium' en laat de inhoud de hoogte bepalen.

---

3. Mobiel apart bewerken: wat wel en niet synchroniseert

Volgens de uitleg van Squarespace pas je de mobiele indeling aan zonder dat desktop verandert. Positie, grootte en zichtbaarheid van blokken zijn per weergave. De inhoud van een blok (tekst, links, knoppen) is wél gedeeld.

Let op: voeg je na het mobiel bewerken nieuwe blokken toe op desktop, dan probeert Squarespace die zelf op mobiel te plaatsen. Controleer mobiel dus altijd als laatste stap. Meer tips staan in mijn mobiele hacks voor Fluid Engine.

---

4. Klassieke secties omzetten naar Fluid Engine

Een klassieke sectie kun je omzetten naar Fluid Engine. Dat is eenrichtingsverkeer: terug kan niet. De sectie krijgt daarbij een nieuwe ID, waardoor eigen CSS die op de oude ID gericht was niet meer werkt.

Mijn advies: maak eerst een kopie van de pagina, zet daarna om en controleer je custom code.

---

5. De 5 fouten die ik het vaakst zie

• Tekst in te brede blokken. Regels van 20 woorden lezen niet prettig. Houd tekstblokken smal.

• Overlap zonder reden. Mooi op desktop, onleesbaar op mobiel.

• Mobiel vergeten. Meer dan de helft van de bezoekers komt via de telefoon.

• Lege blokken als spacer. Gebruik de grid-instellingen.

• Elke sectie anders. Zonder vast systeem oogt je site onrustig.

Meer voorbeelden lees je in 6 design fouten die klanten kosten.

---

6. Mijn werkwijze in Fluid Engine

Ik ontwerp met een vast systeem van kolommen en ritme, en sla goede secties op als Saved Section. Zo bouw je sneller én blijft je site consistent.

Liever niet zelf puzzelen? Met een VIP dag zet ik je bestaande site in één dag strak, ook op mobiel.

---

Veelgestelde vragen over Squarespace Fluid Engine

Kan ik Fluid Engine gebruiken in blogposts?

Nee. Blogposts gebruiken in Squarespace nog de klassieke editor. Fluid Engine werkt in pagina-secties.

Kan ik terug van Fluid Engine naar de klassieke editor?

Nee. Een sectie die je omzet naar Fluid Engine kan niet terug. Maak daarom eerst een kopie van je pagina.

Werkt Fluid Engine op Squarespace 7.0?

Nee, Fluid Engine is alleen beschikbaar op versie 7.1.

Hoeveel kolommen heeft het Fluid Engine grid?

24 kolommen op desktop en 8 kolommen op mobiel.

Waarom ziet mijn site er op mobiel anders uit dan op desktop?

Omdat de mobiele indeling in Fluid Engine apart wordt opgeslagen. Pas je desktop aan na het mobiel bewerken, dan moet je mobiel opnieuw controleren.

Vraag direct je 25% Squarespace korting + 365 dagen proeftijd aan

Meestgelezen artikelen