“Om zowel het overzicht te bewaren als de leesbaarheid te bevorderen is het vaak zaak om hier en daar het design nét dat beetje af te laten wijken van je standaard-indeling.”
Vooral wanneer je wat langere webpagina’s maakt is het slim om deze te segmenteren. Onder te verdelen in duidelijk afgebakende secties. Misschien ben je daarvoor op zoek naar fancy designs. Er was een tijd dat je voor mooie dividers inderdaad bijna verplicht was naar Gutenberg block plugins te grijpen. Maar tegenwoordig kan je ook prima werken met de standaard WordPress-blokken.
Spontaan denk je daarbij natuurlijk aan het Scheidingsteken-blok en het Vulelement-blok. Deze WordPress-blokken dienen speciaal om extra witruimte te creëren op zo’n webpagina. Als je dat wil kan je deze twee blokken ook met elkaar combineren en/ of van een ander kleurtje voorzien. Veel andere opties zijn er echter niet.
Vind je het ook lastig om alles uit de blokeditor van WordPress te halen? Dit is een artikel uit de reeks Mastering block editor. Neem de reeks door en de blokeditor zou voor jou nog weinig geheimen moeten kennen…
- Over templates en patronen in WordPress
- De afmetingen van je site regelen in de blokeditor
- Stijlen: meteen het design van je hele WordPress-site aanpakken
- Menu’s instellen via de blokeditor van WordPress
- Werken met afbeeldingen in de blokeditor
- Snel externe content toevoegen aan je WordPress-site
- Tips om sneller te werken in WordPress
Secties maken in WordPress: mogelijkheden zat in de Blok-inserter
Even kijken wat je nog meer kan doen om je webpagina’s in secties op te delen:
1. Een Paragraaf-blok (1)
Eén van de beperkingen van het Scheidingsteken-blok? Het is een beetje saai en je het niet kan laten variëren qua dikte.
Een alternatief is een simpel Paragraaf-blok dat je leeg laat maar wél voorziet van een gekleurde achtergrond. Dan krijg je een gekleurd balkje dat dienst kan doen als scheidingslijn voor je sectie.
Advertentie
2. Een Paragraaf-blok (2)
Goed, dat lege Paragraaf-blok als scheidslijn voor je secties is een wat onorthodoxe oplossing. Je kan dat blok ook gewoon gebruiken waarvoor het bedoeld is: een alinea of een groep alinea’s uitlichten bij wijze van inzetstukje of samenvatting. Dat kan je dan weer gebruiken als element om 2 secties van elkaar te scheiden.
Maak van de gelegenheid gebruik om je Paragraaf-blok ook visueel in het oog te laten springen. Speel met:
- achtergrond- en tekstkleur
- marges en padding
- uitlijning
- de verschillende lettertypes uit je WordPress-thema
- de randen van het Paragraaf-blok
- …
3. Het Groep-blok
Met het Groep-blok kan je eigenlijk alle kanten uit. Het is specifiek bedoeld om (aaneensluitende) WordPress-blokken samen te houden. Aldus kan een Groep-blok op zichzelf al een sectie vormen.
Overigens is dit blok erg handig om bepaalde gedeeltes van je pagina te laten afwijken van je standaard-indeling.
Dit is hét WordPress-blok om los te gaan met afwijkende kleuren, marges, padding, lettertypes enzovoort. En nog leuk: het groep-blok mag elders op de site hergebruikt worden. Maak er een Patroon van. Een handige manier om de opmaak en indeling van je website consistent te houden.
4. Het Details-blok
Net als het Groep-blok kan je met het Details-blok verschillende WordPress-blokken samenvoegen tot één geheel. Het voordeel is dat je de inhoud van dit blok kan “verbergen” en enkel kan laten uitklappen wanneer de link wordt aangeklikt door je bezoeker.
Dit is handig wanneer je artikel niet té lang wil maken, maar toch je lezer van bijkomende informatie wil voorzien. Het idee is dat enkel wie echt geïnteresseerd is de details zal openklikken.
Omdat de opmaak en indeling van dit blok kan afwijken van je standaard-layout is het prima te gebruiken als divider. Vooral dan wanneer het blok gesloten is.
5. Het Cover-block
Ook het Cover-block is een container. Experimenteer met foto’s en video’s, al dan niet met tekst-overlays. Omdat dit blok vaak wordt ingezet over de volle breedte van je scherm is het uiteraard één van de meest opvallende manieren om content in te delen in secties.
6. Het kolom-blok
Om zowel het overzicht te bewaren als de leesbaarheid te bevorderen is het vaak zaak om het design nét dat beetje af te laten wijken van je standaard-indeling. Via het Kolom-blok kies je natuurlijk voor een iets radicalere oplossing, maar het kan prima werken.
Zo’n kolom-blok werkt meestal niet goed op een kleiner scherm. Vergeet daarom niet de optie Stapelen op mobiel in te schakelen.
7. Het Tabel-blok
Moet je cijfers of andere data delen, dan kan het Tabel-blok van pas komen.
Het is alleen jammer dat die tabel vaak voor geen meter werkt op mobiel. Ikzelf zet er daarom vaak een melding bij in de trant van: “Deze tabel bekijk je het best op een groter scherm.”
8. Het Media & tekst-blok
Het Media & tekst-blok is een alternatief voor het Kolom-blok. Als je tenminste graag een 2-koloms opmaak wil met aan één kant een afbeelding en een stukje tekst aan de andere kant.
Oppassen voor overdaad
Alles bij elkaar heb je dus wel wat mogelijkheden om content in te delen en dus secties aan te maken. Gewoon in de standaard blokkenverzameling van WordPress. Opties waaraan je misschien niet meteen dacht.
Kijk ik naar mezelf, dan merk ik wel dat ik de neiging moet onderdrukken om zo’n pagina te vol te steken. Misschien om het gebrek aan andere visuals op deze site te compenseren?
Advertentie


Geef een reactie