Deze handleiding beschrijft hoe men de WYSIWYG editor kan gebruiken om inhoud toe te voegen en te bewerken.
Hiervoor maken we vanaf 2015 gebruik van de CKEditor voor al onze sites. Voorheen gebruikten we een andere editor, maar omdat de functionaliteit en het uiterlijk is bijna identiek is zal deze handleiding ook bruikbaar zijn voor oudere websites.


De editor kan u vinden bij het aanmaken van een nieuwe pagina, of bij het bewerken (1) van een bestaande pagina.



In ons voorbeeld zien we dat het Body veld bewerkt kan worden met een WYSIWYG editor (2).



Afhankelijk van de complexiteit van uw website kan u onderaan de tekstopmaak (3) van het veld selecteren. 
Deze selectie zal de instellingen en de mogelijkheden (4) van de WYSIWYG editor bepalen.


Bij de opmaakprofielen Filtered HTML en Full HTML zal de WYSIWYG editor ingeschakeld worden.
Wanneer men het profiel Plain text selecteerd zal de WYSIWYG editor uitgeschakeld zijn en is de ingave van inhoud beperkt tot onopgemaakte tekst.



De knoppen en functionaliteit van de WYSIWYG editor zijn zeer vergelijkbaar met die van een tekstverwerkingsprogramma zoals Microsoft Word, Apple Pages of Google Docs.

We overlopen de belangrijkste knoppen. Afhankelijk van het thema van uw website zullen er bepaalde knoppen wel of niet geactiveerd zijn:




  1. Met deze knoppen kan u tekst opmaken:




  2. Met deze knoppen kan u tekst uitlijnen (links, rechts, gecentreerd of uitgevuld), een lijst toevoegen (opsomming of genummerd), de inspringing vergroten of verkleinen en een citaat toevoegen.




  3. Met deze knoppen kan je de uitgevoerde bewerkingen ongedaan maken en opnieuw uitvoeren, inhoud knippen, kopiëren, maar ook plakken (normaal, als platte tekst of als Word-gegevens).

    Wanneer men inhoud plakt, zal de opmaak en structuur ervan worden overgenomen door de WYSIWYG editor. Indien u kiest om te Plakken als platte tekst, zal de opmaak en structuur van de inhoud niet worden overgenomen.

    Als u inhoud vanuit Word wil toevoegen gebruikt u best Plakken als Word-gegevens.
    Dit zorgt ervoor dat er geen onnodige verborgen opmaak wordt overgenomen door de WYSIWYG editor.




  4. Deze knoppen geven u de mogelijkheid om een hyperlink toe te voegen, te bewerken of te verwijderen.
    Hiervoor selecteert u de inhoud die u wil linken en klikt op de knop Link invoegen/wijzigen.


    Er wordt een kader weergegeven waar u het doel van de link kan invullen op het tabblad Linkomschrijving.
    Dit kan een URL zijn, maar ook een e-mailadres, een link naar een element op dezelfde pagina of een link naar een bestand op de server.
    In ons voorbeeld gebruiken we de URL van Google België.


    Op het tabblad Doelvenster kan u bepalen waar de link zich dient te openen.
    Probeer deze opties uit om de verschillende resultaten met elkaar te vergelijken.


    Op het tabblad Geavanceerd kan u nog wat extra informatie toevoegen.
    In ons voorbeeld hebben we "Link naar Google België" als naam van de link ingegeven.
    Meestal zal er buiten de naam niet meer informatie ingevuld moeten worden.


    Wanneer u klaar bent klikt u op OK waarna de link toegevoegd zal worden.


    Wanneer u de pagina zal opslaan zal de tekst als link worden weergegeven, gekoppeld aan het door u ingevoerde doel.






  5. Deze knoppen laten u toe om een afbeelding, horizontale lijn, speciaal teken of een tabel toe te voegen.

    Om een afbeelding toe te voegen klikt u op de Afbeelding knop.

    Daarna klikt u op de knop Bladeren op server om een afbeelding te selecteren.

    Er zal een nieuw venster openen waarmee u een afbeelding kan selecteren of een nieuwe afbeelding kan uploaden op de server.

    In ons voorbeeld gebruiken we een bestaande afbeelding en klikken op Bestand toevoegen.

    De afbeelding zal openen in de WYSIWYG editor waar we nog enkele extra instellingen kunnen invoeren.

    In ons voorbeeld vullen we "Eifeltoren" in bij Alternatieve tekst.

    Daarna klikt u op OK om de afbeelding toe te voegen.


    Met de knop Horizontale lijn invoegen kan u door een horizontale scheidingslijn de inhoud van elkaar scheiden.

    De knop Speciaal teken invoegen zorgt ervoor dat u tekens die niet op het toetsenbord staan alsnog kan toevoegen. Bijvoorbeeld het Copyright-teken of een pijltje dat naar rechts wijst.

    De Tabel knop opent een venster waar je de afmetingen en andere eigenschappen kan bepalen van een in te voegen tabel.





  6. Deze selectielijst bevat enkele stijlen die u kan toepassen op uw content waarvan de stijlen voor koppen de belangrijkste zijn. U kan u deze bijvoorbeeld toepassen op titels en andere hoofdingen.

    Hiervoor selecteert u de tekst waarop u de stijl wil toepassen en kiest u daarna de stijl uit de selectielijst.

    De stijl zal worden toegepast op de geselecteerde tekst.




  7. Met deze knoppen kan u alle inhoud selecteren en inhoud vervangen.

    Alle inhoud selecteren kan handig zijn om bijvoorbeeld alle inhoud te verwijderen.

    Met Vervangen kan u de inhoud doorzoeken om een tekst te vervangen met een andere tekst.




  8. De knop Maximaliseren zal de  WYSIWYG editor vergroten zodat het heel het browservenster inneemt.
    Zo kan u makkelijker focussen op het ingeven van content en is aangewezen te gebruiken indien uw werkt op een scherm met een lage resolutie.