Alles over WYSIWYG editors in Drupal 7

Door Thomas KrooshofBijgewerkt op 4 januari 2024 2 Reacties

Webredacteurs in spe opgelet. In dit artikel behandel ik de installatie en het gebruik van een WYSIWYG editor in Drupal 7.

Ik leg uit wat de voor- en nadelen zijn en hoe je een editor zo kunt configureren dat gebruikers er naar hartelust gebruik van kunnen maken zonder daarbij over de lijntjes van de pagina opmaak heen te gaan.

WYSIWYG editors

WYSIWYG staat voor “What You See Is What You Get”. Deze term werd als eerste gebruikt in relatie tot tekstverwerkers die een pagina op het scherm hetzelfde konden weergeven zoals deze werd uitgeprint, inclusief alle opmaak.

Inmiddels zijn we niet anders gewend dan dat we teksten gemakkelijk kunnen aanpassen middels een interface zoals in pakketten als Microsoft- en LibreOffice. Ook teksten in een online CMS kunnen tegenwoordig met bijna dezelfde vanzelfsprekendheid als in offline tekst-verwerkers worden opgemaakt.

Toegankelijk en snel

De WYSIWYG editor heeft het bloggen niet alleen een stuk toegankelijker gemaakt voor mensen zonder HTML kennis, maar ook een stuk sneller aangezien het handmatig invoeren van codes tijdrovend kan zijn. Maar pas op, deze gebruikersvriendelijke knoppendozen brengen ook een aantal valkuilen met zich mee.

Overmoedigheid en controle verlies

Mensen zonder HTML/CSS achtergrond kunnen nog wel eens iets te overmoedig worden en de editor gaan behandelen als elke andere tekstverwerker. Dat uit zich bijvoorbeeld in het kopiëren en plakken van teksten direct vanuit Word naar hun CMS systeem. Onbedoeld komen hierbij ook allerlei achterliggende codes mee waar Drupal niks mee kan en die de opmaak van een pagina mogelijk flink door de war schoppen.

De oplossingen

Het ontstaan van rommelige code is te voorkomen door teksten uit externe applicaties altijd te plakken met de toetsencombinatie CTRL-ALT-V (in tegenstelling tot CTRL-V). Hiermee plak je puur en alleen de tekst zonder alle opmaak.

In Drupal kun je de editor ook zo instellen dat teksten automatisch zonder opmaak worden geplakt. Eveneens kun je aan de interface een “Paste-from-Word” knop toevoegen waarmee je Word teksten kunt converteren naar HTML (in mijn ervaring moet je hier wel enigszins terughoudend mee zijn omdat die conversie niet altijd even vlekkenloos verloopt).

Laten we eerst eens kijken hoe we überhaupt een WYSGIW editor in Drupal kunnen installeren en vervolgens hoe we de hierboven beschreven configuraties kunnen toepassen.

Een WYSIWYG editor installeren in Drupal

Een nieuwe Drupal 7 installatie bevat standaard nog geen WYSIWIG editor. De eerste stap is dan ook om de WYSIWYG module te installeren en activeren. Wanneer dit is gebeurd kun je vervolgens bovenop de WYSIWYG module naar wens één of meerdere editors installeren, ga hiervoor naar Home » Administration » Configuration » Content authoring » Wysiwyg profiles en lees de instructies. De populairste editors voor Drupal zijn CKeditor en TinyMCE, beide goede opties.

De WYSIWYG editor configuren

Met behulp van de WYSIWYG module kun je ook bepalen in welke situatie, bij welke gebruikers en met welke knoppen een editor getoond moet worden. Standaard heeft een editor nog geen enkele knop. Vergeet daarom niet dat je in Drupal elke functie eerst handmatig zult moeten activeren.

Om knoppen te activeren ga je naar Wysiwyg profiles » Operations » Edit » Buttons en plugins (dit kan pas als er een editor is geïnstalleerd en gekoppeld aan een input format). Kies alleen voor de knoppen die echt nodig zijn, en voeg daarnaast extra schoonmaak functies toe zoals “clean-up”.

Kijk ook eens onder Wysiwyg profiles » Operations » Edit » Cleanup and output. Door onderaan Force cleanup on standard paste te activeren zorg je ervoor dat alle teksten standaard als CTRL-ALT-V worden geplakt. Controleer ook of bovenaan Verify HTMLis aangevinkt.

Alternatieven

Mocht een conservatieve configuratie niet afdoende blijken om de website netjes te houden, maar wil je wel geavanceerde opmaak opties beschikbaar blijven stellen aan gebruikers, dan kun je ervoor kiezen om Markdown te installeren. Dit vereist wel dat redacteurs een nieuw systeem aanleren. Markdown werkt namelijk met codes die handmatig ingevoerd moeten worden maar wel een stuk intuïtiever in gebruik zijn dan HTML.

Tot slot kun je ook offline artikelen schrijven via een applicatie zoals BlogDesk. Zelf heb ik hier nog geen ervaring mee, maar het lijkt mij vooral voor redacteurs die veel onderweg zijn en/of weinig ervaring hebben met CMS systemen een goede optie. Mocht jij ervaring hebben met een offline applicatie dan hoor ik graag hoe dit jou is bevallen.

Conclusie

Met een WYSIWYG geef je altijd een stukje controle weg over je opmaak. Je laat dit immers meer aan de WYSIWYG editor (en haar gebruikers) over. Over het algemeen pakt dit goed uit, maar soms kan het leiden tot in elkaar gedraaide bolletjes wol. Met de juiste configuratie en begeleiding is dit gelukkig goed te voorkomen. Zo niet, dan is er een alternatief in de vorm van bijvoorbeeld Markdown. Weet jij nog andere alternatieven en/of tips?

P.S. Het kan voorkomen dat er iets helemaal fout is gegaan na het bewerken en opslaan van een tekst. Standaard heeft Drupal geen optie om deze tekst te herstellen naar een vorige staat, zogenaamde revisie controle, download hiervoor de Revisioning module.

Meer inzichten over Drupal