Studio Editor: Een onderdeelraster aanpassen
Leestijd 5 minuten
In de Studio Editor worden onderdelen geleverd met een ingebouwd raster met een enkele cel (die het hele onderdeel herbergt). Splits het onderdeel op in meerdere cellen om een responsieve structuur aan de inhoud te geven. Er zijn verschillende aanpasbare indelingen om uit te kiezen.
In dit artikel lees je hoe je:
Wil je cellen aan een container toevoegen?
Je kunt een geavanceerd CSS-raster toepassen op de container.
Cellen aan een onderdeel toevoegen
Voeg cellen toe aan een onderdeel om een responsieve, gestructureerde indeling te maken. Door de elementen in aparte cellen te houden, blijven ze op alle schermen op hun plaats. Kies een indeling en verplaats elementen naar de cellen. Je kunt de cellen altijd splitsen of later nieuwe toevoegen.
Om cellen aan een onderdeel toe te voegen:
- Selecteer het relevante onderdeel in de Editor.
- Klik bovenaan het onderdeel op de Leeg-dropdown.
- Kies een indeling: Rijen, Kolommen, Collage, enzovoort.
Tip: Je kunt de indeling op elk moment wijzigen via de dropdown. Je elementen zullen niet verplaatst worden. - (Optioneel) Sleep elementen naar de relevante cellen.
Cellen in het raster verwisselen
Reorganiseer het onderdeelraster snel en efficiënt door cellen te verwisselen. Met slepen en neerzetten kun je direct tussen twee cellen wisselen. Ze nemen elkaars plek op het raster in.
Om van cel te wisselen:
- Selecteer het relevante onderdeel in de Editor.
- Selecteer de eerste cel.
- Houd bovenaan de cel het Slepen-pictogram
ingedrukt terwijl je deze naar de andere cel sleept.
Tip: Wanneer je de Inhoud omwisselen-indicatie ziet, betekent dit dat je de cel kunt neerzetten.
Het raster aanpassen
Laat de cellen en het raster er precies zo uitzien als jij wilt. Je kunt bestaande cellen splitsen of samenvoegen, nieuwe cellen toevoegen en de rasterlijnen verslepen om hun grootte aan te passen. Je kunt ook lege ruimtes toevoegen om wat ruimte tussen de cellen te creëren.
Om het raster aan te passen:
- Selecteer het relevante onderdeel in de Editor.
- Kies hoe je het raster wilt aanpassen:
Een bestaande cel splitsen
of verticaal splitsen
.
Een nieuwe cel toevoegen
Cellen samenvoegen
Het formaat van een cel wijzigen
Lege ruimtes tussen cellen
Een cel verwijderen
.Let op:
Momenteel is het niet mogelijk om een cel te dupliceren.
Overschakelen naar een geavanceerd CSS-raster
Door over te schakelen naar een geavanceerd CSS-raster krijg je per breekpunt nauwkeurigere controle over de indeling. Je kunt het aantal rijen en kolommen kiezen en hun grootte instellen met behulp van responsieve metingen (zoals fr, Min/max, %).
Om over te schakelen van een onderdeelraster naar een CSS-raster:
- Selecteer het relevante onderdeel in de Editor.
- Klik rechtsboven in de Editor op de Inspector-pijl
. - Scrol omlaag naar Indeling.
- Klik naast CSS-raster op Toepassen.
- Klik op CSS-raster toepassen.
Vond je dit artikel nuttig?
|