De groepsindeling aanpassen

Groepsblokken helpen je om content te organiseren in een container die je als een eenheid kan stijlen en positioneren. Deze handleiding laat je zien hoe je de lay-out-instellingen gebruikt om responsieve, goed uitgelijnde paginagedeeltes te maken met een groepsblok.

Standaard organiseert een groepsblok de blokken binnenin om op elkaar te worden weergegeven. Door aan te passen hoe blokken binnen een groep worden gerangschikt, kan je bepalen of content naast elkaar (horizontaal) of gestapeld (verticaal) wordt weergegeven. Dit geeft je meer flexibiliteit voor de lay-out van je ontwerp. Je kan de uitlijning van de content in de groep aanpassen door deze stappen te volgen:

1. Selecteer Lijstweergave bovenaan het bewerkingsscherm.
2. Selecteer het groepsblok.
3. In de zijbalk Blokinstellingen aan de rechterkant kies je een van deze opties:
   • Groep: de standaardregeling voor groepsblokken.
   • Stapelen: rangschikt blokken verticaal, boven op elkaar. Ideaal voor het maken van duidelijke, opeenvolgende content zoals stappen of uitgelichte items.
     • Onder Rechtvaardigingwijzig je verticale uitlijning met opties zoals boven, midden of onder.
   • Rij: plaatst blokken horizontaal naast elkaar. Perfect voor het maken van functievergelijkingen of afbeeldingsgalerijen.
     • Onder Rechtvaardigingpas je de horizontale uitlijning aan met opties zoals links, midden, rechts of ruimte ertussen.
   • Raster: organiseert blokken in een aanpasbare rasterindeling. Handig voor productweergaven of teamleden.
4. Klik op ‘Opslaan’ of ‘Publiceren’ om je wijzigingen op te slaan.

Door de totale breedte van je groepsblok in te stellen, kan je een visuele hiërarchie op je pagina maken en aanpassen hoe je content reageert op verschillende schermformaten. Je kan bepalen hoeveel ruimte het groepsblok gebruikt, van contentbreedte tot grote breedte en volledige breedte, door deze stappen te volgen:

1. Selecteer Lijstweergave bovenaan het bewerkingsscherm.
2. Selecteer het groepsblok.
3. Klik in de werkbalk die verschijntop het pictogram‘Uitlijnen’ en kies uit:
   • Content (of ‘Geen’): stelt de breedte van blokken in op de standaardbreedte van waar de content zich bevindt. Beste keuze voor normale contentgedeeltes.
   • Grote breedte: stelt de breedte van blokken in op een grotere (maar niet volledige) breedte. Goede keuze als je aandacht wilt vestigen op belangrijke content zonder het hele scherm in beslag te nemen.
   • Volledige breedte stelt het blok in om de volledige breedte van het beschikbare gebied te vullen. Perfecte keuze voor het maken van indrukwekkende contentgedeeltes zoals banners of grote afbeeldingsgalerijen.
4. Klik op ‘Opslaan’ of ‘Publiceren’ om je wijzigingen op te slaan.

Meer informatie over de breedte van je content wijzigen.

Je kan bepalen hoeveel ruimte je content inneemt binnen een groep, wat handig is bij het maken van responsieve ontwerpen die goed werken op zowel mobiele als desktopschermen. Volg deze stappen om de breedte-instellingen van content binnen je groepsblokte wijzigen:

1. Selecteer Lijstweergave bovenaan het bewerkingsscherm.
2. Selecteer het groepsblok.
3. In de zijbalk Blokinstellingenga je naar het gedeelte‘Binnenste blokken’. Zet de instelling ‘Binnenste blokken gebruiken contentbreedte’ om naar:
   • Aan: de content volgt de contentbreedte-instellingen van de site; pas anders specifieke breedtewaarden aan met behulp van de breedte-regelaars.
   • Uit: content wordt uitgebreid om de volledige breedte van het groepsblok te vullen.
4. Klik op ‘Opslaan’ of ‘Publiceren’ om je wijzigingen op te slaan.

De instelling ‘Binnenste blokken gebruiken contentbreedte’ bepaalt hoe breed de content in je groepsblok wordt weergegeven:

Bij Aan: content binnen je groepsblok volgt de algemene contentbreedte-instelling van je site (meestal ongeveer 700-800px breed). Dit zorgt voor een ingesloten, gecentreerde kolom met content, zelfs als je groepsblok de volledige breedte van de pagina inneemt. Dit verbetert de leesbaarheid op grotere schermen terwijl de indeling aantrekkelijk blijft om te bekijken.

Bij Uit: content binnen je groepsblok neemt de gehele breedte van het groepsblok zelf in. Als je groepsblok op volledige breedte is ingesteld, strekt je content zich ook uit over de volledige breedte. Dit is nuttig voor het maken van rand-tot-rand ontwerpen zoals galerijen met afbeeldingen over de volledige breedte. Het kan ook van pas komen als je wilt dat de content overeenkomt met de breedte van de achtergrond van je groepsblok.

Een praktisch voorbeeld: stel dat je een groepsblok hebt met een gekleurde achtergrond die de volledige paginabreedte inneemt. Als je ‘Binnenste blokken gebruiken contentbreedte’ zou inschakelen, creëert dit een gecentreerde kolom met content met de gekleurde achtergrond die zich van rand tot rand uitstrekt; perfect voor het markeren van belangrijke informatie terwijl je tegelijkertijd visueel interesse blijft opwekken.

Door afmetingen aan te passen, kan je de hoogte, breedte en afstand van je groepsblok regelen om beter aan je content- en lay-outbehoeften te voldoen. Dit helpt je om visueel uitgebalanceerde gedeeltes te maken en geeft je content ruimte om te ademen. Stel nauwkeurig de afstand in rond de content van je groepsblok door deze stappen te volgen:

1. Selecteer Lijstweergave bovenaan het bewerkingsscherm.
2. Selecteer het groepsblok.
3. In de zijbalk Blokinstellingenga je naar het gedeelte Afmetingen .
4. Stel waarden in voor:
   • Opvulling: ruimte tussen je content en de rand van je groepsblok. Meer opvulling zorgt ervoor dat je content meer ademruimte heeft.
   • Marge: ruimte rond de buitenkant van het groepsblok. Helpt dit gedeelte te scheiden van andere content.
5. Gebruik het koppelingspictogram om te schakelen tussen uniforme of individuele zij-aanpassingen.

Meer informatie over het aanpassen van Blokafmetingen.

Door deze afstand aan te passen, kan je bepalen hoe dicht of ver uit elkaar content in je groepsblok verschijnt.Hierdoor kan je de juiste visuele relatie tussen elementen creëren. Dit helpt bezoekers onderscheid te maken tussen gerelateerde content terwijl het gedeelte samenhangend blijft. Beheer de afstand tussen blokken binnen je groep als volgt:

1. Selecteer Lijstweergave bovenaan het bewerkingsscherm.
2. Selecteer het groepsblok.
3. In de zijbalk Blokinstellingenga je naar het gedeelte Afstand tussen blokken .
4. Gebruik de knoppen om het volgende in te stellen:
   • Afstand tussen blokken: ruimte tussen afzonderlijke blokken. Meer afstand zorgt voor duidelijke scheiding, terwijl minder afstand ervoor zorgt dat content meer verbonden tot elkaar voelt.
   • Minimale hoogte: hoe hoog het groepsblok minimaal moet zijn. Handig voor het maken van consistente gedeeltes of voor het toevoegen van witruimte voor visuele balans.

Meer informatie over de afstand tussen blokken aanpassen.