HTML-EDITOR GEBRUIKEN

Transcriptie

1 HTML-EDITOR GEBRUIKEN Over TinyMCE TinyMCE is een kleine What-You-See-Is-What-You-Get (WYSIWYG) editor voor teksten. De bediening vindt plaats in de web browsers, zoals MSIE of Mozilla. Het werken met deze editor is eenvoudig, omdat de bediening veel lijkt op het werken met teksten in (office-) tekstverwerkers. TinyMCE gebruiken De WYSIWYG kan op 3 manieren gebruikt worden: 1. u plaatst HTML code met inline CSS gewoon in de code-editor (openen via de knop HTML bron bewerken - ) 2. u plakt tekst van een Word document via de plakken vanuit word tool -. De opmaak wordt zoveel mogelijk bewaard. 3. u typt gewoon de tekst in de WYSIWYG. De editor zal automatisch alinea s en breaks toevoegen. Nadat de tekst werd geplaatst op één van de drie mogelijkheden dan kunt u door middel van de WYSIWYG editor altijd de opmaak wijzigen. Het is echter aan te raden om altijd in de code zelf de HTML tags en CSS stijlen te wijzigen. Hiervoor is natuurlijk HTML en CSS kennis vereist. Contacteer uw vertrouwt reclame-agentschap of uw IT afdeling voor meer info over HTML en CSS. Toolbox Om de opmaak van een job te wijzigen, maakt u gebruik van de toolbox. De toolbox vindt u boven de jobdetails en bedrijfsprofiel en ziet er als volgt uit: 1

2 Betekenis iconen a. Tekst opmaak: Vet: is het wat dikker maken van tekst. Cursief: is het wat schuin zetten van tekst. Onderstrepen: is het onderlijnen van tekst. Links uitlijnen: Is het links uitlijnen van tekst. Centreren: Is het centreren van tekst. Rechts uitlijnen: Is het rechts uitlijnen van tekst. Uitvullen: Is het uitlijnen van tekst in een blok. Alinea: hier kunt u tekstblokken een bepaalde opmaak geven. Selecteer de tekst en kies een code in de dropdowmenu. Alinea Adres Vaste opmaak Kop1 Kop2 Kop3 Kop4 Kop5 Kop6 2

3 Lettertype: met deze knop kunt u het lettertype instellen. Selecteer de tekst en kies een lettertype in de dropdowmenu. Arial Trebuchet Verdana Tekengrootte: hier past u de tekengrootte aan. Selecteer de tekst en kies een tekengrootte in de dropdowmenu. 8pt 36pt Vanuit word plakken: gebruik deze knop om tekst van uit een word document te gebruiken. De standaardopmaak van alinea s, koppen zal behouden blijven. Teksten uit Word brengen veel opmaaktekens mee die: 1. de tekst op de website groter maakt dan nodig 2. de in datanewsjobs gekozen opmaak in de weg kan zitten 3. vreemde teksten / tekens kan veroorzaken U dient eerst de tekst in Word te selecteren en te kopiëren naar het klembord. Afhankelijk van de browser wordt, als op de knop invoegen uit Word wordt geklikt, de tekst direct op de plaats van de cursor ingevoegd (zoals bij Internet Explorer). Bij andere browsers (zoals FireFox) wordt eerst een pop-up venster getoond waar de tekst met ctrl-v in geplakt moet worden, waarna op OK of Annuleren gedrukt wordt. b. Opsommingen : Opsommingtekens: Is een ongenummerde lijst maken. Druk op de knop en druk enter, er komt automatisch een nieuwe opsomming. Nummering: Is een genummerde lijst maken. Druk op de knop en druk enter, er komt automatisch een opvolgend nummer. c. Fout gemaakt: Ongedaan maken: heeft u een fout gemaakt? klik op deze knop om terug te keren. Herhalen: Om door te gaan als u ongedaan maken hebt gedaan. 3

4 d. HTML bewerken/invoegen van: Link invoegen/bewerken: Deze knop dient om een link te maken of te bewerken naar een andere pagina of een foto. Selecteer de tekst of foto (thumbnail) en typ de link of selecteer de originele foto. -Hier heeft u een pop-up met 4 verschillende tabs (Algemeen / pop-up / gebeurtenissen / geavanceerd ) -pop-up Link verwijderen: dient om een link te verwijderen. Na de link geselecteerd te hebben, druk op de knop. Anker invoegen/bewerken: Dient om een soort link te maken op een bepaalde zone van dezelfde pagina. Selecteer een tekst, en druk op deze knop en tik er een naam in, doe hetzelfde op tekst in dezelfde document met de andere tekst. Tik dezelfde naam in de pop-up. Afbeelding invoegen/bewerken: dient om een afbeelding in te voegen of te vervangen in uw job. Druk op de knop en er komt een pop-up. Plak de link waar uw afbeelding staat ( ). -Er is 1 pop-up met 3 tabs ( Algemeen / Weergave/ Geavanceerd ) HTML bron bewerken: opent een venster met de HTML-broncode waar u HTML kan wijzigen/ bekijken. Kennis van HTML is vereist -pop-up Spellingcontrole: controleer uw tekst op spelfouten. Bepaal eerst uw taal, daarna selecteert u de volledige tekst, druk op de knop. De foute woorden verschijnen rood onderlijnt. Klik rechts om dit aan te passen. Tekstkleur: pas de kleur van een/meer letter(s), woord(en) of paragraaf aan. Tekstmarkeringskleur: wijzig de achtergrondkleur van de pagina of een of meer cellen van een tabel 4

5 e. Speciale bewerking tekst: CSS stijl bewerken: Verander de CSS stijlen. Druk op de knop en u ziet een pop-up met 7 tabs. -één pop-up met volgende tabs (Tekst / Achtergrond / Blok / Box / Rand / Lijst / Positionering ) Media invoegen/bewerken. Druk op de knop om video in flash (*.flv en *.swf), quicktime (.mov) of andere formaten in te voeren. - één pop-up met 2 tabs (Algemeen / Geavanceerd ) Volledig scherm: schakel tussen het volledig scherm en normaal scherm. Druk op de knop en de TinyMCE zal in het volledige scherm getoond worden, klik nog eens om terug te keren naar het normale scherm. 5