De TinyMCE editor is een open scource WYSIWYG HTML-editor die je in staat stelt webpagina's makkelijk aan te passen zonder dat enige kennis van speciale tekens noodzakelijk is. Via de gebruiksvriendelijke interface kan men snel en eenvoudig foto's en hyperlinks invoegen.

Alle input en opmaak worden rechtstreeks weergegeven waardoor je steeds het eindresultaat voor ogen hebt.

Gebruik van de TinyMCE editor

Zodra de TinyMCE Editor geïnstalleerd is wordt deze onmiddellijk geladen wanneer u een pagina toevoegd of bewerkt. Hieronder vindt u een schermafdruk van de TinyMCE Editor.

TinyMCE src

De editor is bestaat uit drie delen. Bovenaan vindt u de werkbalk, in het midden vindt u de pagina die u bewerkt en onderaan vindt u de statusbalk.

De werkbalk bevat tal van knoppen om de opmaak aan te passen, foto's of links in te voegen. In onderstaand schema vindt u een overzicht van de belangrijkste knoppen

TinyMCE

Een link invoegen of bewerken

  1. Wanneer u een link wenst in te voegen geeft u eerst de tekst op waarop men moet kunnen klikken.
  2. Vervolgens selecteert u dit woord, die zin of afbeelding.
  3. Klik op het icoon "Link invoegen of bewerken"
  4. Onderstaand dialoogvenster wordt geopend. Selecteer de link naar de pagina, contactpagina of het bestand in het selectievak "Link list"
  5. Indien u linkt naar een bestand kunt u bij "File action" kiezen om het bestand rechtstreeks te laten downloaden of het in een venster te laten openen.
  6. Klik op "Insert" om de link in te voegen

Opgepast: Wanneer u een link naar een bestand opnieuw bewerkt dient u de "File action" opnieuw in te stellen.

TinyMCE link

Een afbeelding invoegen of bewerken

  1. Klik op de knop "Afbeelding invoegen of bewerken"
  2. Onderstaand dialoogvenster wordt geopend. Klik op het selectieveld "Image list" en selecteer de afbeelding die u wenst in te voegen
  3. Via het tweede tabblad "Appearance" kunt u de grootte van de afbeelding aanpassen. Bij "Dimensions" hebt u twee velden waarmee u de breedte en hoogte van uw afbeelding in pixels bepalen. Via het selectievak eronder kunt u een aantal standaard-groottes kiezen.
  4. Klik vervolgens op "Insert"
  5. Indien u de afbeelding verder wenst aan te passen klikt u op de afbeelding en vervolgens terug op de knop "Afbeelding invoegen of bewerken"

TinyMCE img

 

Bron: http://web52.be/pages/index/57-Gebruik_van_de_TinyMCE_Editor.html