Toon de juiste weergave van tekst in je WordPress-editor

WordPress maakt al sinds jaar en dag gebruik van TinyMCE als editor voor het ingeven van tekten voor pagina’s en berichten.

Zodra de beheerder van een website start met het ingeven van teksten, zal hij/zij merken dat de lay-out in de editor niet overeenkomt met de uiteindelijke weergave op de website.

Bij het inladen van een webpagina wordt er steeds een extern bestand (stylesheet) ingeladen. In dit bestand staan alle stijl- en lay-outregels omschreven die verantwoordelijk zijn voor de uiteindelijke weergave.

Door een koppeling te leggen tussen de WordPress-editor en de stylesheet kan je ervoor zorgen dat de verschillende stijlregels automatisch in de editor weergegeven worden. Op die manier kan de auteur van teksten onmiddellijk controleren hoe de uiteindelijke tekst er zal uitzien.

Voorbeeld

De koppeling kan je leggen met de functie: add_editor_style( $stylesheet ).

Voeg deze functie toe aan functions.php en zorg voor een relatieve verwijzing naar je stylesheet.
add_editor_style(‘stylesheet/style.css’);

Heb je de stylesheet aangepast en worden de aanpassingen niet weergegeven in de editor?

Dit probleem wordt veroorzaakt door de caching van de editor. Je kan dit probleem eenvoudig vermijden door de “time()”-instructie toe te voegen. Zo heeft de cache geen invloed op de weergave in de editor.

add_editor_style(‘stylesheet/style.css’ . time());

Codex

Alle informatie over deze functie kan je rustig nalezen op de Codex van WordPress: http://codex.wordpress.org/Function_Reference/add_editor_style