Het grootste voordeel van WordPress-blokthema’s in combinatie met de editor? Met slechts een paar muisklikken kan je zo’n site een andere look en feel geven en aanpassen aan je behoeften. Zonder van WordPress-theme te veranderen. Geen kat die nog kan raden welk WordPress-theme je gebruikt. Dat allemaal dankzij Stijlen.
Leestijd: ca. 6 minuten
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. Meer uit deze reeks:
Telkens weer verbaast het me hoe kleine veranderingen soms een groot effect kunnen hebben voor de algemene look and feel van een blog of website. Een nieuw font hier, een ander kleurtje daar, een andere indeling zus, een decoratief elementje zo,… Details die een wereld van verschil kunnen maken.
Wat kan je met Stijlen?
Via Stijlen – global styles in het Engels – bepaal je de standaardopmaak van zowat alle elementen op je WordPress-site1. De achtergrond, het kleurenpalet, de lettertypes, tussenkopjes, lijsten, afbeeldingen, enzovoort.
En het leuke is: elke wijziging die je aanbrengt in Stijlen is meteen van toepassing op je ganse site. Dat is natuurlijk erg handig als je een consistente opmaak wil voor je site. Of als je de vormgeving wil aanpassen aan je branding. Daarnaast blijf je altijd de mogelijkheid hebben om individuele blokken aan te passen en ze dus te laten afwijken van wat je hier instelt.
Echt alle opties en instellingen van WordPress Stijlen tot in detail bespreken gaat ons te ver leiden. Ik beperk me hier tot de meest gebruikte zaken.
WordPress Stijlen openen
Wanneer je bent ingelogd in je WordPress-dashboard kan je WordPress Stijlen openen:
- klik bovenaan in de zwarte balk op Site bewerken
- klik vervolgens rechts boven in het scherm op het ronde icoontje Stijlen
Of:
- ga via je dashboard naar het tabje Weergave
- kies dan voor Editor
- Links op het scherm kan je dan Stijlen selecteren
Stijlcombinaties
Je ziet al meteen een aantal voorgestelde stijlcombinaties. Deze zijn standaard ingesteld voor jouw blocktheme. Het hangt van je gekozen thema af hoeveel het er zijn en hoe ze eruitzien. Klik een stijlcombinatie aan en rechts op het scherm krijg je al een goed beeld van hoe het er aan de voorkant van je site zal aan toe gaan. Als je de wijzigingen opslaat krijgt je website meteen een make-over.
Naar mijn aanvoelen zijn vooral de blockthemes die WordPress tegenwoordig standaard aanbiedt gul met stijlcombinaties.
Zijn de voorgestelde stijlcombinaties niet echt jouw ding? Geen probleem. Je kan een stijlcombinatie als basis kiezen en deze dan aanpassen. Klik daarvoor op het potlood-icoon Stijlen bewerken om aan de rechterkant van het scherm in het menu Stijlen terecht te komen.
De link Blader door stijlen toont je wederom een aantal pre-sets. Stijlcombinaties, maar ook extra kleurenpaletten en fontcombinaties. Klik en probeer uit wat bij je past, zou ik zeggen.
Stijlcombinaties aanpassen in WordPress
Je hoeft het dus niet eens te zijn met de (soms gewaagde) keuzes van je theme-bouwer. Bovendien, omdat je zoveel aanpassingsmogelijkheden hebt is het ook niet altijd nodig om van WordPress-thema te veranderen. Een overzichtje.
1. Typografie
Hier kan je de lettertypes voor je site bepalen. Niet alleen die voor de bodytekst maar ook die van de kopteksten, de links en de knopteksten bijvoorbeeld. Ook kiezen voor verschillende fonts voor verschillende elementen is geen probleem.
Hier denk je in de eerste plaats aan lettertypes, maar ook dit is nog eens apart in te stellen:
- Lettergrootte
- Weergave (zwaarte van de letter en de opmaak)
- Regelafstand (witruimte tussen de tekstregels)
- Letterafstand (afstand tussen de letters)
- Decoratie (tekst onderstrepen of doorhalen)
- Hoofdletter/kleine letter
Waarschijnlijk komt je blocktheme ook hier met bepaalde pre-sets. Vind je niets naar je zin? Geen probleem, Sinds WordPress 6.5 kan je extra lettertypes importeren voor je WordPress-website.
2. Kleuren
Kies voor het tabje kleuren als je graag de kleuren wil aanpassen van alle elementen van je site.
Kies een standaard palet en geef vervolgens alle elementen een gepaste kleur. Klik op het knopje met de 3 puntjes en je kan de kleur bepalen van zowat alle elementen.
En daarnaast is er de mogelijkheid om ook eigen kleurenpaletten aanmaken:
- klik op het pijltje naast het palet, je komt in het menu Palet bewerken
- klik op het plusje bij Aangepast om een kleur aan je palet toe te voegen
- klik op het kleurtje om een kleur aan te passen, een kleurkiezer wordt geopend
- druk opnieuw op het plusje om nog een kleur toe te voegen
- klik op min (-) om een kleur uit het palet te verwijderen
Overigens, als je de exacte kleurcode kent van een kleur kan je die meteen invoeren in het daartoe bestemde vakje.
3. Achtergrond
Je hebt de mogelijkheid om de achtergrond van je site van een achtergrondfoto te voorzien. Klik Achtergrondafbeelding toevoegen om een fotobestand uit je mediabibliotheek te kiezen of er eentje te uploaden.
Dit deed ikzelf nog nooit. Mij lijkt het erg lastig om een afbeelding te kiezen terwijl je er toch vooral moet voor zorgen dat je pagina prettig leesbaar blijft. Maar goed, het kan.
4. Schaduwen
Geef (sommige gedeelten van) je website een 3D-effect via Schaduwen. De bedoeling is om hier dus een slagschaduw in te stellen. Je kan onder meer spelen met de hoek waaronder de schaduw valt. Ook de kleur van de schaduw is in te stellen.
5. Lay-out
Gebruik dit tabje om de standaardbreedtes voor je WordPress-website in te stellen. Lees gerust het artikel als je er meer over wil weten.
6. Blokken
Alsof dat allemaal nog niet genoeg is kan je alle beschikbare WordPress-blokken nog eens apart configureren. Klik het tabje Blokken en gebruik eventueel de zoekbalk om het WordPress-blok te vinden dat je wil aanpassen.
Breng je wijzigingen aan in WordPress Stijlen, dan gelden die voor de gehele site.
Het Stijlboek van WordPress
Met al die mogelijkheden wordt het weleens lastig om het overzicht te bewaren en je in te beelden hoe een en ander in de praktijk uitpakt. Maar gelukkig is daar het Stijlboek. Je krijgt een globaal visueel beeld van hoe je WordPress-blokken en dus je website er aan de voorkant uit komen te zien. Zo hoef je alvast niet voortdurend te switchen tussen de voor- en achterkant van je website. Eigenlijk onmisbaar als je snel een consistent design wil voor je site.
Het Stijlboek is er niet alleen om naar te kijken. Je mag ook hier de vormgeving en indeling van al je WordPress-blokken bepalen. Net zoals je dat bij de Stijlen deed.
Trouwens, ook wanneer je via het Stijlboek veranderingen aanbrengt worden deze doorgetrokken over heel je website.
Stijlboek openen
Wanneer je bent ingelogd in je WordPress-dashboard kan je WordPress Stijlboek openen:
- klik bovenaan in de zwarte balk op Site bewerken
- klik vervolgens rechts boven in het scherm op het ronde icoontje Stijlen
- klik onder Stijlen op het oog-icoontje Stijlboek
Of:
- ga via je dashboard naar het tabje Weergave
- kies dan voor Editor
- links op het scherm kan je dan Stijlen selecteren
- klik tot slot het oog-icoontje aan
Stijlboek aanpassen
Open je Stijlboek en klik op een WordPress-blok in het centrale venster. Rechts op het scherm verschijnt een werkbalk waar je zaken kan instellen specifiek voor het WordPress-blok dat je momenteel aan het bewerken bent. Wijzig iets en meteen zie je het effect daarvan in het Stijlboek. Merk op dat het Stijlboek een aantal tabjes heeft:
- Tekst
- Media
- Ontwerp
- Widgets
- Thema
Zo komen alle WordPress-blokken van je WordPress-setup aan bod.
Foutje gemaakt? Gebruik Revisies
Goed mogelijk dat je door al dat gepruts met opmaak en instellingen je site helemaal verknoeid hebt. Het gebeurt mij in ieder geval regelmatig. En dan is de functie Revisies best nuttig. Want WordPress houdt een geschiedenis bij van de wijzigingen die je doorvoerde. Aldus kan je makkelijk terug naar een vorige versie. Tenminste, zolang je je WordPress-database niet opschoonde. Zo open je de Revisies (en kan je terugkeren naar een vorige versie):
- ga via je dashboard naar het tabje Weergave
- kies dan voor Editor
- links op het scherm kan je dan Stijlen selecteren
- klik centraal op het scherm, rechts verschijnt de werkbalk
- klik rechts van het tabje Stijlen op het klok-icoontje Revisies
- je vind een lijst met de laatste revisies, kies een revisie die je wil gebruiken
- klik Toepassen
Enfin, niet eens zo stiekem is WordPress Stijlen een verduiveld krachtige toolkit voor als je relatief snel een website wil opzetten. Of als je een bestaande WordPress-website een grondige facelift wil geven.
Voetnoten:
- Ook voor het instellen van de standaard afmetingen van je site kan je trouwens terecht in WordPress Stijlen. Dit onder het tabje Lay-out. ↩︎
Geef een reactie