De Html Content module is het meest gebruikte module type. Het stelt u in staat om een blok tekst te maken met illustraties en eventueel video en geluidsfragementen.
Module Instellingen
Het tabblad met instellingen specifiek voor dit module type ziet er als volgt uit:
Helaas lukt het me niet om de meeste van deze settings aan de praat te krijgen.
Alleen de Editor Heigth lijkt het correct te doen. Het aantal pixels dat u hier invult bepaalt de hoogte van de html text editor tijdens de invoer van content.
Content toevoegen
Om content toe te voegen aan een Html Content module klikt u zoals gebruikelijk op de Edit link naast de kop van de module. In de veronderstelling dat u in het Administration --> Site Settings menu de FCKEditor heeft ingestelt opent zich nu het volgende onderhoudsvenster:
Ik veronderstel dat u als Content Manager vrij veel ervaring heeft met moderne tekstverwerkers als Word. De FCKEdiitor biedt u een rijke gereedschapskist. De gereedschappen zijn toegankelijk via de pictogrammen in toolbar bovenaan de editor:
Neemt u even rustig de tijd om met de muis over elk pictogram te zweven. Een tooltip geeft dan aan wat de functie van het pictogram is.
Ik licht hier slechts een beperkt aantal functies toe die anders zijn dan u gewend bent in een gewone tekst editor. Hoewel u gewone tekst typet, mag u niet vergeten dat op de achtergrond html door de teksteditor wordt gecreërd. Ook mag u niet uit het oog verliezen dat u online op een webserver werkt met deze teksteditor. Als u een afbeelding wilt invoegen dan zult u er dus eerst voor moeten zorgen dat het afbeeldingsbestand op de server terecht komt.
Hyperlink maken
In teksten op websites wordt veelvuldig gebruik gemaakt van hyperlinks. U kunt zowel een afbeelding als een tekstfragment van een hyperlink voorzien:
- selecteer de afbeelding of het tekstfragement
- klik op het
pictogram om een dialoogvenster te openen
- vul de gewenste url in naar een webpagina die geen deel uitmaakt van uw eigen site of...
- klik in het dialoogvenster op Bladeren op server om een link te maken naar een pagina op uw eigen site.
- Bladeren op server opent een nieuw venster met een aantal mappen. U vindt alle pagina's van uw eigen site in de map Pages.
Hyperlinks die u op deze manier maakt verlaten de pagina met de link en vervangen die door de nieuwe pagina. Voor links naar pagina's binnen uw eigen site is dat waarschijnlijk precies uw bedoeling. Voor URL's buiten uw eigen site kan dit een groot nadeel hebben. Uw bezoeker verlaat namelijk uw eigen site en belandt op de site van de nieuwe pagina. Alleen als de bezoeker later met zijn browser terug navigeert zal hij weer op uw eigen site uitkomen. U raakt met externe links dus gemakkelijk bezoekers kwijt. Om dat probleem te vermijden is het wenselijk dat de externe pagina in een nieuw browser scherm opent. Het oorspronkelijke browserscherm met uw eigen pagina blijft dan dus gewoon open staan op de achtergrond. Als de bezoeker op een gegeven moment het nieuwe browserscherm sluit heeft hij plotseling weer uw site in beeld. De FCKEditor maakt het helaas niet mogelijk om hyperlinks op deze manier in te stellen. U zult handmatig een detail aan de achterliggende html moeten toevoegen.
HTML code bekijken en aanpassen
U kunt de achterliggende HTML code bekijken en bewerken met het volgende pictogram: 
U ziet in de editor nu opeens veel meer dan alleen de tekst die u heeft ingevoerd. HTML betekent Hyperlink Text Markup Language. Het bevat codes tussen <gepunte haken > die tags worden genoemd. De tags bevatten allerlei informatie voor de browser waardoor de browser precies weet wat hij moet doen met de tekst. Het kan layout informatie betreffen (bijvoorbeeld kleur of lettertype). Maar het kan ook de om heel andere zaken gaan zoals de informatie waar een afbeelding gezocht moet worden of de URL van een hyperlink.
Normaalgezien hoeft u de html code niet handmatig te bewerken. Maar de werkelijkheid kan weerbarstig zijn. Het heeft zeker voordelen als u een klein beetje thuis bent in HTML code zodat u handmatig kleine deatails kun wijzigen. Ik geef als voorbeeld het veranderen van een hyperlink naar een externe pagina. Neem als voorbeelde de volgende link naar de homepage van mijn My Coral Album site. In HTML ziet deze hyperlink er als volgt uit:
<a href="http://www.mycoralalbum.nl"> My Coral Album</a>
De zichtbare tekst (My Coral Album) staat tussen een openings <a> tag en een sluit </a> tag. De openings tag bevat extra informatie over de URL. Door op URL te klikken wordt deze pagina van de mojoPortal handleiding vervangen door de My Coral Album homepage. U kunt de <a> tag gemakkelijk aanpassen zodat de nieuwe pagina opent in een nieuw browserscherm. U breidt de <a> tag uit met target="blank". De complete hyperlink in HTML wordt dan als volgt:
<a href="http://www.mycoralalbum.nl" target="blank">My Coral Album</a>
Bekijkt u het effect maar eens door op deze hyperlijk te klikken: My Coral Album in een nieuw venster als demonstratie.
Afbeeldingen toevoegen
U kunt met de FCKEditor gemakkelijk afbeeldingen toevoegen aan uw tekst.
- zet de cursor op de plek waar u de afbeelding wilt invoegen
- klik op het
pictogram
- klik in het dialoogvenster op Bladeren op Server
U ziet nu een overzicht van de mappen op de server waar u toegang toe heeft. In mijn geval ziet dit er als volgt uit:
U ziet in dit voorbeel onder andere de map Images. Deze map heb ik zelf aangemaakt. U doet er verstandig aan om uw eigen afbeeldingen altijd in een zelf aan te maken map Images op te bergen. Eventueel kunt u binnen die map weer met submappen werken.
Om een nieuw map aan te maken doet u het volgende:
- open eerste de parent map
- klik op de knop Create New Folder
- er opent zich nu een klein dialoogvenster waarin u de naam van de nieuwe map invult. In sommige gevallen wordt dit verhinderd door een popup blocker. Hef die dan eerst op en klik opnieuw op de knop.
U kunt afbeeldingen op de server klaarzetten met het Administration --> File Manager menu. Maar u kunt ook met het hierboven weergegeven scherm nieuwe afbeeldingen op de server zetten. Doe het volgende:
- Open de server map waar u de afbeelding in wilt opbergen. Maak zonodig eerst een geschikte map aan op de server.
- Zoek de afbeelding op uw eigen PC op met de Browse... knop.
- Klik op de Upload knop.
- De afbeelding verschijnt nu in de map op de server. Dubbelklik op het bestand.
Nu wordt het volgende dialoog venster getoond waarmee u extra instellingen aan de afbeelding kunt geven:
Alternative tekst geeft u de kans een beschrijvende tekst in te voeren voor slecht zienden en voor bezoekers die het tonen van afbeeldingen in hun browser hebben uitgeschakeld.
Breedte en Hoogte spreken voor zich. Standaard worden de afmetingen van uw afbeelding weergegeven in pixels. Door deze afmetingen te veranderen zal de browser de afbeelding groter of kleiner weergeven dan de originele grootte. Met het slotje bepaalt u of de oorspronkelijke hoogte/breedte verhouding bewaard moet worden.
Rand, HSpace en VSpace worden gebruikt om de marges tussen afbeelding en omringende tekst in te stellen (deze zijn standaard nul).
De Uitlijning keuze lijst is verwarrend. Standaard wordt de afbeelding door de browser gezien als een bijzondere letter in de lopende regel tekst. De hoogte van de lopende regel tekst wordt dan ook aangepast aan de hoogte van de afbeelding. U ziet dit in het voobeeld in het dialoogvenster.
De verschillende opties in de Uitlijnings keuzelijst stellen u in staat om de tekst om de afbeelding heen te laten vloeien. De meeste opties betreffen de vertikale uitlijning van de afbeelding ten opzichte van de omringende tekst. het is helaas niet mogelijk om de afbeelding rechts uit te lijnen. Dit heeft te maken met de beperkingen van HTML. Experimenteert u zelf maar eens met de diverse mogelijkheden om het effect te zijn.
Wilt u fijnmazige controle over de plaatsing van een afbeelding dan zult u gebruik moeten maken van tabellen. Deze techniek wordt zeer veel toegepast in webpagina's. U kunt de dikte van de lijnen van de tabel op nul zetten zodat de tabellijnen onzichtbaar worden. Op deze manier kunt u bijvoorbeeld een afbeelding rechts uitlijnen. U kunt netzoveel tabellen in tabellen zetten als u zelf wilt. Elke cel van een tabel kan namelijk weer om het even wat voor HTML inhoud bevatten. Hiermee kunt u zeer compleze sturcturen opbouwen. De onderhoudbaarheid van de pagina gaan er niet op vooruit...
U kunt de instellingen van een bestaande afbeelding bekijken en bewerken via een rechter muisklik op de afbeelding.