handleiding joomla 1.5
DESCRIPTION
Handleiding Joomla 1.5TRANSCRIPT
©2007 pjpprojects.nl >>>PJP Projects Webdesign
1
Werken met Joomla 1.5
Inleiding
Deze cursus is een uitvoerige en gedetailleerde tutorial betreffende het gebruik van Joomla
1.5.
De cursus beschrijft de installatie, het configureren van Joomla 1.5 alsook de basis
betreffende het maken van Joomla 1.5 templates.
De cursus gaat er vanuit dat U geen enkele voorkennis heeft van Joomla.
Joomla is een ‘Open Source’ (maw gratis) ‘Content Management Systeem’.
Het is een PHP (en MySQL) geschreven pakket die toelaat om volledige websites online te
plaatsen, waarbij derden ook inhoud kunnen plaatsen op de site, en dit zonder dat ze HTML
kennen.
Wanneer Joomla gebruiken?
Deze vraag kan ik het makkelijkst met de vraag beantwoorden: Wanneer NIET Joomla
gebruiken?
Als je een zeer bedreven schrijver bent van HTML, CSS en PHP code, lijkt mij de
toegevoegde waarde van Joomla inderdaad beperkt.
Als dit niet het geval is, dan is Joomla een perfecte oplossing. Het helpt je om op een
eenvoudige manier complexe zaken in je website te integreren (zoekfunctie, commentaren,
fotogalerijen, forums,….)
Het essentiele voordeel van Joomla blijft dat derden inhoud kunnen wijzigen of toevoegen,
zonder dat ze enige kennis hebben van HTML, CSS of PHP.
Zo kun je na het opmaken van een website, het beheer overlaten aan derden.
Op www.pjpprojects.nl vind je reeds een cursus Joomla. Maar dat betreft een tutorial
aangaande de versie 1.0.13.
Echter de Joomla communiteit heeft de opvolger, met name Joomla1.5, reeds geintroduceerd.
Bij het schrijven van deze cursus, was de versie Joomla 1.5 RC3 (release candidate 3)
beschikbaar. Deze versie is stabiel genoeg om een persoonlijke website mee te maken.
Wat zijn de voordelen van Joomla 1.5 tov Joomla 1.0.13?
É2007 pjpprojects.nl >>>PJP Projects Webdesign
2
Op deze vraag is het moeilijk een zeer concreet antwoord te vinden.
Het beste (nederlandse) antwoord heb ik terug gevonden in het tijdschrift PCM
Zware belasting
Voor versie 1.5 van Joomla! is de gehele code grondig onder de loep genomen en op veel
plekken herschreven. De code is efficiënter en het templatesysteem, dat bepaalt hoe de site
eruitziet, is sterk verbeterd. Vorige versies gebruikten matig gecodeerde html-tabellen, terwijl
hedendaagse webdesigners vinden dat tabellen taboe zijn. Zij gebruiken liever cascading style
sheets (css). Versie 1.5 voldoet aan hun wensen, maar om te voorkomen dat oude templates
niet meer werken, kunt u ervoor kiezen om toch tabellen te gebruiken. Het is opmerkelijk dat
de standaardtemplate van 1.5 wel met tabellen werkt, maar door een vinkje te veranderen kunt
u kiezen voor een template zonder tabellen. Pluspunt: hierin zijn de koppen van artikelen
voorzien van de html-tag H1, belangrijk voor de vindbaarheid in zoekmachines.
Eenvoudiger te installeren
Opvallend is dat de installatie van versie 1.5 eenvoudiger is geworden. Voorheen moest u
bepaalde mappen met de hand beschrijfbaar maken. Dat is verleden tijd. Joomla! omzeilt de
niet-beschrijfbare mappen door uitbreidingen via ftp te uploaden en daarna te installeren. Wel
moeten we het configuratiebestand handmatig aanpassen en zelf uploaden via een ftp-
programma. Dit euvel kwamen we bij vorige Joomla!-versies ook al tegen, maar mogelijk
heeft dit te maken met de instellingen van onze hostingprovider.
Nederlands 'praten'
Versie 1.5 ziet er wat gelikter uit en heeft een overzichtelijk administratiegedeelte. Een artikel
plaatsen is eenvoudig dankzij de knop Nieuw artikel toevoegen, waarna nog slechts één
wysiwyg-editor tevoorschijn komt voor zowel het intro als de bodytekst. Joomla! 1.x laadde
hiervoor twee wysiwyg-editors – dat was onnodig zwaar.
Het administratiegedeelte 'praat' voortaan Nederlands en dat is ook nieuw. Het is eenvoudiger
geworden om uitbreidingen, templates en taalbestanden is installeren, doordat er nog slechts
één installer bestaat. Joomla! zoekt zelf uit of u de installer voorziet van een component,
module, plug-in of taalbestand. Handig! De nieuwe Joomla!-versie gebruikt UTF-8 om tekens
op te slaan, waardoor het cms nu ook met buitenissige tekens overweg kan, zoals Chinese of
Arabische.
Traditioneel zijn er voor Joomla! veel uitbreidingen beschikbaar, bijvoorbeeld om een
fotoalbum te tonen of om bezoekers te laten reageren op artikelen. Omdat versie 1.5
grotendeels is herschreven, werken de 1.x-uitbreidingen niet standaard. Wie echter 1.5 in
Legacy-modus draait, kan ze wel gebruiken. Helaas krijgen wij soms een foutmelding bij
installatie en gebruik van 1.x-componenten. Uitkijken dus als u wilt overstappen. Wel slim:
oude componenten gebruiken nog vaak html-tabellen. Als u van deze tabellen af wilt, kunt u
ze automatisch laten vervangen door css-code, bijvoorbeeld div'jes.
Bron: PCM
©2007 pjpprojects.nl >>>PJP Projects Webdesign
3
Tenslotte nog dit:
Alvorens je Joomla leert, lijkt het me ten zeerste aangewezen de basis van HTML, CSS en
PHP te leren. Voor gedetailleerde cursussen betreffende dit onderwerp, bezoek www.web-
garden.be.
Je webhosting moet PHP en MySQL ondersteunen.
Firefox
Gedurende het schrijven van deze handleiding is gebleken dat Joomla 1.5RC3 en Internet
Explorer geen aller beste vriendjes zijn. Joomla maakt voor een aantle menu’s gebruik van
Javascript. De positionering van de dan geopende vensters in IE6 is ronduit slecht. In Firefox
heb je dit probleem niet!!
Hoofdstuk I. Downloaden.
Je kunt de Engelstalige hier Joomla 1.5 RC3 (rc3 = release candidate 2) downloaden.
Daar bij het schrijven van de cursus de Nederlandse versie nog niet beschikbaar was,
gebruiken we de gedurende deze cursus de Engelstalige versie. Er is voldoende aandacht
besteed aan het weergeven van Nederlandse begrippen gedurende de uiteenzettingen.
Naderhand is ook een Nederlandse versie beschikbaar gekomen. Deze kun je hier
downloaden.
Vervolgens pak het zip bestand uit ergens op je harde schijf. Na uitpakken dien je met een
FTP programma de uitgepakte bestanden te downloaden op je webserver. Zelf heb ik daar toe
een map ‘joomla’ aangemaakt op de webserver.
Zorg dat je de mappen structuur van de uitgepakte bestanden respecteert.
Na downloaden op je server, dien je deze mappen strucuur te zien.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
4
Hoofdstuk II. Installatie
Na downloaden van de bestanden, typ je volgende URL in je webbrowser
http://www.jouwwebsite.net/joomla
Dit veronderstelt dat je de joomla bestanden hebt geplaatst op je webserver in de map joomla.
Als je in de root geïnstalleerd hebt, dan wordt de URL: http://www.jouwwebsite.net
©2007 pjpprojects.nl >>>PJP Projects Webdesign
5
De keuze staat op Nederlands. Klik op “Volgende” in de rechter bovenhoek.
In de bovenste rechthoek dienen alle parameters een ‘Ja’ te hebben. Indien er een rode ‘neen’
verschijnt;;;neem dan contact op met je webprovider.
In de onderste rechthoek kunnen afwijkingen (rood) staan. In principe mag dit de werking van
Joomla niet verstoren.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
6
Klik op “Volgende” in de rechter boven hoek
Hierbij staan de licentie voorwaarden betreffende het gebruik van Joomla. Er is weinig andere
keuze dan deze te accepteren door te klikken op “Volgende” in de rechter bovenhoek.
Hierbij dien je nu gegevens in te brengen die je gekregen hebt van je webprovider. Dit kan
alleen als je webprovider MySQL (of MySQLi) ondersteunt.
(Naam) Host: vermoedelijk is dit ‘localhost’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
7
Gebruikersnaam(‘username’): Dit is de gebruikersnaam voor je database. Let op: de
gebruikersnaam van je database kan verschillend zijn van de gebruikersnaam die je gebruikt
om in te loggen op bijv. de statistiek pagina van je provider
Wachtwoord (‘password’): Dit is het paswoord voor je database. Let op: idem als hierboven.
Naam database: Info aangeboden door provider
Eenmaal alles keurig ingevuld…klik dan even op “Geavanceerde instellingen”
Als je een oude installatie van Joomla hebt, kun je inderdaad beter kiezen voor “oude tabellen
backuppen”.
Alle tabellen aangemaakt bij de Joomla installatie zullen het voorvoegsel ‘jos_’ meekrijgen.
Als je al tabellen hebt die toevallig die deze pre-fix hebben, vul hier dan een andere prefix in.
Maar gebruik, zoals aangegeven, geen ‘bak_’
Klik nu op “volgende” in de rechter boven hoek
©2007 pjpprojects.nl >>>PJP Projects Webdesign
8
Dit is optioneel.
Gezien ik steeds met een afzonderlijk FTP programma werk, zet ik een vinkje bij “Nee”
(FTP bestandssysteemlayer inschakelen)
Naam website: Vul hier de naam van je joomla website in. Dit is niet hetzelfde als de URL
van je website.
Voorbeeld: Web-Garden Webdesign
©2007 pjpprojects.nl >>>PJP Projects Webdesign
9
De bijgaande uitleg op het scherm lijkt mij meer dan duidelijk. Het ingebrachte wachtwoord
zul je dus moeten gebruiken om als administrator straks in te loggen. Dus verlies het niet ☺
Plaats een vinkje bij “Installeer standaard voorbeelddata”
Klik vervolgens op “Installeer voorbeelddata”
Indien u upgrade van een oude versie naar Joomla 1.5 dient u te kiezen voor “Laad
migratiescript”.
Klik nu op Volgende (rechtsboven)
Zo eenvoudig is een Joomla installatie ☺
Via een FTP programma ga je naar de map op de webserver waar je Joomla hebt
geïnstalleerd.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
10
Verwijder nu de inhoud en de map “installation”!!
(PS: Stel dat je voor een of andere reden de installatie opnieuw wil doen. Verwijder
installation dan niet. Je moet dan wel op je server het bestand “configuration.php”
verwijderen. Vervolgens kun je de installatie opnieuw doen)
Klik vervolgens op “site” bovenaan rechts op het scherm
©2007 pjpprojects.nl >>>PJP Projects Webdesign
11
Uw website staat online!!!
Dit is wat men noemt de “front-end” (frontpage) van je joomla website. Dit is wat de
bezoeker ziet.
Klik nu even in het linkermenu op “Administrator”
Bij username vul je keurig “admin” in.
Bij password breng je nu het paswoord in die we daarnet hebben ingebracht (bij de
installatie)
Language (taal): daar laat je “default” staan.
Klik vervolgens op “Login”.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
12
Dit is wat men noemt de “back-end” van je Joomla site. Dit is niet zichtbaar voor de bezoeker.
Dit is waar de inhoud wordt ingebracht, of waar de layout wordt aangepast.
Hoofdstuk III: Joomla! configureren
De website die nu online staat, is vermoedelijk niet de site die u voor ogen had ☺
Maw we moeten de site aanpassen aan u wensen en/of behoeftes.
In dit hoofdstuk gaan we ons bezig houden met de inhoud van de site.
De layout of template aanpassen is voer voor een aander hoofdstuk.
Alles wat we nu aanpassen of bespreken, gebeurt in de back-end omgeving (maw
administrator pagina)
Je kunt de administrator pagina oproepen via volgende URL:
http://www.mijnwebsite.com/joomla/administrator/
Dit is de URL indien je de installatie van Joomla hebt gedaan in de map “joomla”.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
13
Breng je gebruikersnaam (username) en paswoord (password) in
We willen eerst af van de introductie tekst dewelke rechts staat op bovenstaande pagina.
Ga naar ‘extensions>module manager
©2007 pjpprojects.nl >>>PJP Projects Webdesign
14
Klik nu op ‘Administrator’ in submenu onder <Module Manager>
Plaats nu een vinkje in het vakje voor “Welcome to Joomla”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
15
Klik nu op “Delete” (rechtsboven)
Klik nu op ‘Site>Control Panel’
Vervolgens krijgen we het begin scherm van de administrator pagina…maar zonder welkom
tekst.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
16
We focusseren ons nu op een gedetailleerde bespreking van het bovenste menu.
Eenmaal alle functies de revue zijn gepasseerd, zullen de onderstaande knoppen (Add New
Article, Articel Manager, Front Page Manager,….) duidelijk worden.
Deze knoppen zijn namelijk een snellere toegang tot de functies die ergens opgenomen zijn in
het bovenste menu
.
III.A Site
Beweeg de muis over ‘Site’ in het bovenste menu.
Als je op ‘control panel’ klikt, dan kom je op de start pagina van de administrator pagina.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
17
User Manager:
Met de user manager beheer je de gegevens van personen die toelating hebben om inhoud op
de website te wijzigen of te plaatsen.
Logisch dat er nog maar 1 persoon is gedefinieerd. Met name, u als persoon die Joomla heeft
geinstalleerd.
We gaan nu even een nieuwe gebruiker (“user”) toevoegen:
Klik op “New” – rechtsboven
Name: Vul de naam in de van de gebruiker die toegang heeft tot de website
Username: Dit is de gebruikersnaam waarmee de gebruiker dient in te loggen
©2007 pjpprojects.nl >>>PJP Projects Webdesign
18
E-mail: E-mail adres van de gebruiker(“user”)
New password: Geef hier het paswoord in die de gebruiker moet gebruiken om in te loggen.
Dit paswoord moet jij dus bepalen
Verify Password: Je moet het paswoord een tweede keer inbrengen, om zeker te zijn dat er de
eerste maal geen typfouten zijn gemaakt.
Bij Group wordt het iets complexer ☺. Dus “fasten seatbelt…” ☺
Je ziet dat er een opdeling is tussen Front-end gebruikers (maw zij die inloggen via de ‘Home
Page’ van de website) en de ‘Back-end’ gebruikers (maw zij die inloggen via de inlogpagian
van de administrator webpagina).
Front-end gebruikers gaan naar de frontpage (homepage) van de website en loggen daarin via
het log-in
©2007 pjpprojects.nl >>>PJP Projects Webdesign
19
Front-End
Registered
Deze categorie gebruikers heeft zeer weinig mogelijkheden. Ze kunnen mogelijke verborgen
pagina’s ook lezen.
Author
Deze gebruiker kan zijn eigen inhoud op de website aanpassen.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
20
Editor
Deze gebruikers kunnen alle inhoud op de website aanpassen.
Publisher
Een ‘Author’ en ‘Editor’ kunnen dus wijzigen of toevoegen. Maar ze kunnen niet publiceren
(=on-line plaatsen). Ze moeten wachten op de goedkeuring van een ‘hoger gerangschikte’.
Een Publisher kan inhoud toevoegen of wijzigen, en vervolgens ook publiceren (on line
plaatsen).
Dus de nieuwe of aangepaste inhoud opgemaakt door een Author of Editor kan door een
Publisher online geplaatst worden.
Back-End
Back-end gebruikers zijn gebruikers die net als u kunnen inloggen via de administrator log in
Manager
Manager
Site:
Media Manager (Kan afbeeldingen beheren)
Preview. (kan een site bekijken bij wijzigingen)
Statistics (kan statistieken betreffende bezoekers raadplegen)
Menu:
Access and edit existing Menus (kan een menu aanpassen)
Content: (kan alle parameters betreffende inhoud wijzigen)
Content by Section
All Content
Static Content Manager,
©2007 pjpprojects.nl >>>PJP Projects Webdesign
21
Section Manager,
Category Manager
Front Page Manager
Archives Manager.
Page Impressions
Administrator
Site:
Trash Manager, (beheer van de prullenbak)
User Manager (may create/edit/delete any user of the same level or below – all except
Super Administrator.) (kan ieder ondergeschikte of gelijkgestelde gebruiker wijzigen)
Menu:
Menu Manager (kan menu wijzigen)
Modules:
Site Modules (Joomla beschikt over Website Modules.Een Administrator kan er
toevoegen of weghalen)
Administrator Modules (Hier wordt bepaald hoe de ‘back-end’ site eruitziet)
Components
Banners (met banners wordt bedoeld: reklame-banners)
Contacts (contact gegevens voor de site bezoekers)
News Feeds (inhoud van de rubriek News aanpassen)
Polls (beheren en plaatsen van polls)
Syndicate
Web Links (beheer van de rubriek Links in het hoofdmenu)
Mambots:
Site Mambots (het integreren van andere website in jou website)
Installers (installeren van onderstaande modules)
Components
Modules
Mambots
Super Administrator
Site:
Global Configuration
Language Manager (kan de taal van de website aanpassen)
Template Manager (kan de layout van website en administrator pagina aanpassen)
Site
Administration
User Manager (kan gebruikers toevoegen, veranderen of verwijderen. )
Components:
Mass Mail (kan via de website een mailing uitsturen)
Messages:
Inbox (kan via de website een e-mail versturen)
Configuration
©2007 pjpprojects.nl >>>PJP Projects Webdesign
22
Bekijken we nu het rechter stuk van de pagina:
Back-end language: Je kunt hier de taal kiezen dewelke de gebruiker in kwestie wil
gebruiken.
Front-end language: Je kunt hier de taal kiezen in de welke de inhoud op de site zal worden
weergegeven.
User Editor: als de front-end gebruiker inlogt, zal hij een tekst editor ter beschikking krijgen
waarmee hij/zij zijn inhoud kan aanpassen. Hier kun je aangeven welke editor dit is.
Het is aangewezen te kiezen voor TinyMCE 2.0.
Help Site: Als de gebruiker mogelijks ondersteuning wil bij het inbrengen van zijn inhoud
kun je hier een site kiezen die gekoppeld wordt aan de help functie .
Tijdzone: Hier kies je voor UTC+1.00 Amsterdam, Berlijn,….
Als oefening hebben we hier volgende info ingebracht:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
23
Vervolgens klikken we op “Save” in de rechter boven hoek.
Media Manager
Ga naar Site>Media Manager
©2007 pjpprojects.nl >>>PJP Projects Webdesign
24
Volgend scherm opent zich:
De Media manager is een instrument om je afbeeldingen, gebruikt in je Joomla site, beter te
kunnen beheren.
De standaard weergave is de “Thumbnail View (weergave)”. Persoonlijk lijkt me de Detail
View weergave beter.
Klik op Detail View
©2007 pjpprojects.nl >>>PJP Projects Webdesign
25
Links zie je dat bij Folders de map Media is aangeduid. Dit is een beetje verwarrend daar er
op je webserver helemaal geen map “Madia” is terug te vinden. Met Media wordt hier de
bedoeld de map ‘images’ op je webserver. Kijk even via FTP of die je terug vindt.
Open nu even via FTP de map ‘images’ op je webserver.
Nu zie je ook de 4 sub-directories (banners, M_images, smilies en stories) dewelke je in de
Media Manager hierboven ook ziet.
In de Media Manager staat bij Files op het eerste zicht de URL (van een map) die niet te
begrijpen valt ☺
©2007 pjpprojects.nl >>>PJP Projects Webdesign
26
Dit verwijst naar de map op je webserver waar de afbeeldingen staan. Gezien het feit dat je
een plaats op een webserver huurt bij een provider, is het eerste stuk van bovenstaande URL
(/customers/web-garden.nl/web-garden.nl) toe te wijzen aan een mapstructuur opgemaakt
door je webhosting bedrijf. De rest van de URL is dan toe te wijzen aan je eigen
mappenstrucuur.
Onze installatie is gedaan in de map “joomla”. Daarin bevindt zich een sub-map met naam
“images”.
In die map “images” kun je nu een nieuwe sub-map maken.
We maken een nieuwe sub-map met naam “submap”, en klikken vervolgens op “Create
Folder”.
Vervolgens kunnen we nu ook afbeeldingen toevoegen aan een van de folders.
(Deze functionaliteit bevindt zich onderaan de pagina)
Via de functie “bladeren” kun je een bestand (afbeelding) aanwijzen. Door te klikken op
“Start Upload” kun je de afbeelding downloaden in de folder naar keuze.
Om een vergrote afbeelding te kunnen zien klik je op de link van de afbeelding.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
27
Dan krijg je:
Door te klikken op de toets “vorige” in je browser, kom je terug op het overzicht
Global configuration
We klikken op Site>Global Configuration
©2007 pjpprojects.nl >>>PJP Projects Webdesign
28
Vervolgens krijgen we:
We hebben nu 3 submenu’s: Site, System en Server
Bovenaan zie je de pagina behorend bij submenu “Site”.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
29
Site offline : Ik mag aannemen dat je hier “No” in brengt. Zodoende is je site zichtbaar voor
alle surfers op het internet. Als je “No” aangeeft…dan krijgt de bezoeker een foutboodschap
die weergegeven is in “Offline Message”
Offline Message: De foutboodschap die de bezoeker krijgt als de site offline staat.
Site-name: Dit is de naam van je site. Dit moet niet noodzakelijk de URL van je site zijn.
Default WYSIWYG Editor: zoals reeds eerder aangegeven kunnen sommige gebruikers
(users) toegang hebben tot de website. En dit om inhoud aan te passen of toe te voegen.
Om dit te doen krijgen ze toegang tot wat men noemt een tekst editor. In feite het best te
vergelijken met een afgeleide van het programma “Word” (Microsoft). Hier kies je het type
editor die de gebruiker moet gebruiken. Kies voor “Editor-TinyMCE 2.0”.
List-length: Vermoedelijk zullen op je website een aantal ‘lijsten’ voorkomen. Voorbeeld :
“Links”. (waar je linhks weergeeft naar andere site).
Met “list-length” geef je de maximum lengte aan een lijst. Als de lijst langer wordt dan zal hij
een extra pagina aanmaken.
Bij Metadata Settings breng je informatie aan dewelke gebruikt wordt voor zoekmachines
zoals Google, Yahoo,…
Meta informatie komt steeds in de header van een webpagina te staan.
Voorbeeld:
meta name="generator" content="Joomla! 1.5" />
<meta name="description" content="Joomla!
- the dynamische portaalmotor en arikelenbeheersysteem" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<meta name="keywords" content="joomla, Joomla" />
Global site Meta description: Hier kun je de meta “description” informatie inbrengen dewelke
verwijst naar je website.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
30
(Nota: je zult later de mogelijkheid krijgen om Meta “descprition” info toe te voegen aan
individuele pagina’s)
Global Site Meta Keywords: Hier kun je meta “keywords” inbrengen, dewleke betrekking
hebben op je volledige site.
Show Meta Title Tag: Als je “Yes” aangeeft, wordt voo iedere individuele pagina ,een meta
lijn toegevoegd met de titel van je pagina. Het is aangewezen om “Yes” te behouden.
Voorbeeld:
<meta name="title" content="Welcome to Joomla!" />
Show Author Meta Tag: Als je “Yes” aangeeft dan wordt een extra meta lijn toegevoegd met
de naam van de auteur van de pagina of tekst. Gezien je met Joomla diverse gebrukers
(“users”) kunt hebben…kan de auteursnaam verschillen
Voorbeeld:
<meta name="author" content="Administrator" />
Nu kijken we even rechts van de “Site” pagina:
Dit is een tricky stukje.
Standaard zien de URL’s aangemaakt door Joomla er als volgt uit:
http://www.example.com/Joomla150/index.php?option=com_contact&Itemid=3
Dit zijn typische URL’s voor PHP geschreven sites. Ze zijn helaas niet SEO vriendelijk. Maw
Google kan van bovenstaande URL weinig maken.
Door Search Engine Friendly URLs op “Yes” te plaatsen, zal Joomla wel SEO vriendelijke
URL’s aanmaken
http://localhost/component/option,com_contact/cursusHTML/
Echter, het is niet voldoende om hier alleen maar een “Yes” te plaatsen.
In de hoofd directory van je Joomla installatie staat een bestand met de naam htaccess.txt. Dit
bestand moet je hernoemen in .htaccess. (Vergeet het puntje niet voor htaccess)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
31
Omdat dit te eenvoudig zou zijn, maken we het dus nog een stukje complexer ☺
De webserver waarop je site (via je provider) is geïnstalleerd kan draaien op 2 software
pakketten. Linux of Windows.
Als het Linux is dan kun je ongestoord het bestand htaccess.txt herbenoemen in .htaccess.
Als het Windows is, dan kun je dit niet zomaar. Dan moet je een extern programma
gebruiken, zoals bijvoorbeeld “Ultraedit” (http://www.ultraedit.Com)
Met behulp van het FTP programma kan ik nu het bestand htaccess.txt herbenoemen
(rename).
©2007 pjpprojects.nl >>>PJP Projects Webdesign
32
Druk op OK…en…klaar.
Zoals je ziet heeft het bestand .htaccess heen indicatie van bestandstype (.php, .html,
.jpeg,….). Dat kan de oorzaak zijn van het feit dat je FTP programma na de naamswijziging
het bestand .htaccess niet weergeeft in het bestanden-overzicht.
Maw vraag aan je provider:
a)of ze Linux of Windows draaien op de webserver
b)of je htaccess bestanden kunt herbenoemen?
Ik ben behoorlijk lang stikgestaan bij dit “htaccess” verhaal, omdat het zeer belangrijk is. De
score resultaten van je website in Google zullen zeker beter zijn.
Sommigen zullen nu beweren dat Joomla niet vriendelijk is voor Google. Dit heeft niets te
maken met Joomla, maar alles met het gebruik van PHP. Het gebruik van PHP kan aanleiding
geven tot het vormen van SEO onvriendelijke URL’s. Vandaar het belang van het htaccess
verhaal.
Conclusie: Hier valt exht wat te experimenteren alsmede je webprovider even op de rooster te
leggen. Ikzelf heb er heerlijk en leerrijke chatsessies met www.one.com op zitten ☺
Bij SEO settings staat er een tweede vraag:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
33
“Use Apache mod_rewrite” Gelieve hier bij voorkeur “No” in te geven. Tenzij je webserver
het ondersteunt, en je heel goed weet wat je doet. Deze topic is dermate complex dat ze buiten
deze cursus valt.
Als je gebruik maakt van RSS feeds…kun je hier verdere info inbrengen.
Global Configuration: SYSTEM
©2007 pjpprojects.nl >>>PJP Projects Webdesign
34
System Settings
Secret word:
Hopelijk heb je dit nooit nodig☺. Bij installatie van Joomla heb je een paswoord moeten
definieren. Echter Joomla bewaart het paswoord niet als dusdanig maar onder een gecodeerde
vorm. Die code staat onder secret word.
Path to Log folder: Activiteiten binnen je Joomla site worden gelogd (geregistreerd) en
bewaard in een bestand. De plaats van deze bestanden is de sub-directory “logs”.
Help Server: Hier kun je instellen welke help bron gebruikers ter beschikking krijgen.
User settings
Allow user registration: Via het Log in Formulier op de Home Page van je website kunnen
front end gebruikers zich inloggen. Dit formulier kan ook gebruikt worden daar voorbijgaande
bezoekers om zich te registreren.
Registratie van internet bezoekers moet zinvol zijn. Als je er geen belang bij hebt dat
bezoekers zich kunnen registreren, zet hier dan “No”.
New User Registration Type: Als je registratie toelaat en gebruikt op je site, kun je ook
aangeven wat de bevoegdheden zijn van de nieuwe geregistreerde bezoeker.
New User Account activation: Om te vermijden dat het registratie formulier gebruikt wordt
door automatische robots, kun je hier instellen dat er bij registratie een e-amil naar de
geregistreerde bezoeker wordt gestuurd. Die moet dan via een link in zijn ontvagen mail zijn
account op jou site activeren.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
35
Front-end User Paramaters: Als je “show” opgeeft zal de front-end gebruiker bij inloggen de
mogelijkheid krijgen om zijn account gegevens aan te passen
Media settings
Legal extensions (file types): Hier geef je de bestandsextensies op die mogen worden gebruikt
Maximum size: Als je via Joomla bestanden gaat opladen, is er een maximum grootte
ingesteld. Hier kun je die instellen.
Path to File folder: De naam van de subdirectory waar opgeladen bestanden van gebruikers
(users) worden opgeslagen is in dit geval “images”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
36
Path to Images Folder: dit is de subdirectory waar door gebruikers (users) opgeladen
afbeeldingen zullen worden opgeslagen.
Debug Settings
Dit laat toe om eventuele problemen op je website te detecteren en weer te geven. Echter dit is
alleen bestemd voor diegene die zeer goed vertrouwd zijn met PHP en MySQL.
Cache Settings
Een Joomla website wordt opgemaakt dmv PHP. Dit betekent concreet dat een opgeroepen
webpagina niet direct beschikbaar is (zoals HTML), maar bij oproep wordt samengesteld aan
de hand van informatie die is opgeslagen in een database. Dit vergt tijd.
Als je de “Cache” optie aanzet, dan bewaart Joomla de meest frequent gevraagde pagina’s in
een tijdelijk geheugen (=cache). Dit heeft als voordeel dat die pagina’s sneller zullen laden.
Cache Time: Na xxxx minuten wordt het cache geheugen leeggemaakt en terug “opgefrist”.
Session Settings
“Session” is weer een PHP kreet. Als je als gebruiker (user) inlogt op een Joomla website,
wordt een “session” aangemaakt. Als je niet uitlogt, dan zal Joomla automatisch de sessie
afsluiten na ‘15’ minuten. Dan zul je dus genoodzaakt worden op terug in te loggen.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
37
Global Configuration: SERVER
Server Settings
Hier kunnen we heel snel zijn…laat deze instellingen ongewijzigd.
Locale settings
Zet de tijdinstelling zoals hierboven weergegeven.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
38
FTP Settings
Let wel: bovenstaand schermpje (FTP settings) is alleen zichtbaar als je webprovider een
webserver ter beschikking stelt die draait op Linux.
Als de Webserver op Windows draait, dan krijg je onderstaand schermpje
Als een gebruiker (user) een afbeelding of een bestand wil opladen dan gebruikt Joomla daar
standaard een PHP script voor. Echter sommige webproviders laten dit vanwege
veiligheidrisico’s niet toe.
In dit geval stelt Joomla een ingebouwd FTP protocol ter beschikking. De gegeven die je
hierbij moet invullen dien je te krijgen van je webprovider.
PS: Je kunt natuurlijk gewoon je eigen standaard FTP programma gebruiken om zaken op te
laden op je website.
Database settings
Deze gegevens krijg je aangeleverd door je webprovider.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
39
Database Prefix: Deze term lijkt mij een beetje ongelukkig gekozen. Alle tabellen die door
Joomla worden aangemaakt krijgen de prefix jos_ . Laat dit ongewijzigd.
Mail Settings
Je kunt vanuit Joomla een e-mail versturen naar alle gebruikers (users) van je website.
Mailer: Je kunt hier een keuze maken tussen PHP Mail Function of Sendmail. Deze laatste
wordt ondersteund door Linux webservers (check bij jou provider)
Mail from: dit is het e-mail adres van waaruit je de mail verstuurd.
From Name: Hier komt de naam te staan die jij wil laten verschijnen in de “From” (“Van”)
lijn van een e-mail bericht
Sendmail Path: Als je SendMail gebruikt dan moet je hier de directory opgeven waar
SendMail is geïnstalleerd. In principe ontdekt Joomla die automatisch bij installatie.
Tenminste als je webprovider die optie ondersteunt.
SMTP Authentication: Hier moet je “Yes” opgeven als je een e-mail adres hebt die toegekend
of verkregen is door een provider als kpn, telenet, skynet,…. Als je gebruik maakt van Gmail
of Hotmail kun je hier “No” inbrengen.
Verdere SMTP gegevens dien je op te vragen bij de provider van je e-mail adres.
PS: Je kunt natuurlijk ook een e-mail versturen via je gewone e-mail programma ☺
©2007 pjpprojects.nl >>>PJP Projects Webdesign
40
III.B Menu
III.B.1 Menu Manager
In de Menu Manager krijg je een overzicht van alle menu’s die op je website staan.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
41
III.B.2 Menu Trash
Stel dat je een volledig menu uit je website gooit (via Delete ), dan komt die hier te
staan.
Dit is te vergelijken met de “Prullenbak” functie in windows.
III.B.3 Main Menu
©2007 pjpprojects.nl >>>PJP Projects Webdesign
42
We onderscheiden een extra ‘boven-menu’
Daaronder heb je een overzicht van de “links” opgenomen in het “Main Menu”
We bekijken eerst het bovenste extra menu:
Menus: Dit brengt je terug naar de Menu Manager.
Default: Met deze functie kun je de link in het menu aangeven waarmee de website bij
bezoek opstart.
Als je je actuele website oproept dan krijg je de “Home” pagina te zien
We plaatsen nu voor Joomla!Overview een vinkje
©2007 pjpprojects.nl >>>PJP Projects Webdesign
43
Vervolgens klikken we op “Default”
Nu bezoeken we onze online website opnieuw.(mogelijks moet je even “verversen” )
Nu stel je vast dat de website start op de pagina gekoppeld aan de link “Joomla!Overview”.
We herstellen nu even de oorspronkelijke situatie. We plaatsen een vinkje voor “Home” en
klikken op “Default” in het bovenste menu
©2007 pjpprojects.nl >>>PJP Projects Webdesign
44
Publish: Als je hier op klikt zorg je ervoor dat een link uit het menu ook zichtbaar is.
Unpublish: Als je hier op klikt zorg je ervoor dat een link uit menu niet meer zichtbaar is
Move: Met deze functie kun je een link uit een menu verplaatsen naar een nader menu
Voorbeeld: We plaatsen een vinkje voor de link “FAQ”
Vervolgens klikken we op “Move” in het bovenste menu
Bij”Move to Menu” kun je nu een menu kiezen naar dewelke de link “FAQ” moet verplaatst
worden
We kiezen voor “othermenu”, en klikken vervolgens op “Move” rechtsboven.
We bezoeken nu opnieuw onze online website.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
45
We zien dat de link “FAQ” nu inderdaad is toegevoegd aan het menu “other menu”
Edit: Met deze functie kun je parameters betreffende een link uit het menu lezen en
aanpassen.
Voorbeeld: Voor de link “The News” plaatsen we een vinkje
Vervolgens klikken we op “Edit” rechtsboven
©2007 pjpprojects.nl >>>PJP Projects Webdesign
46
Menu Item Details
Alvast eerst even de volgende opmerking: hier wordt alleen een overzicht gegeven van de
links uit een menu. Maw hier wordt niet gepraat over de inhoud (content) gekoppeld aan een
bepaalde link. Dit komt verder in de cursus uitvoerig aan de orde. We praten hier alleen over
de tekst van de link, de plaats van de link in het menu, de zichtbaarheid van een link,enz..
Title: Hier breng je de titel in van je link. Met deze naam komt de link op je website te staan.
Alias: Hier kun je een bijkomende naam ingeven. Deze info komt onderaan in de browser te
voorschijn als de bezoeker met muis beweegt over de link
Als Alias is hier ingebracht ‘the-news’. Als een bezoeker met zijn muis over “The News” link
in het Main Menu beweegt ziet hij onderaan de link……./index.php/the-news
Link: Dit is de door Joomla aangemaakte URL voor deze link
Display in: Hier geef je het menu aan in dewelke de link moet worden opgenomen.
Parent name: Hier kun je mogelijk submenu’s gaan maken.
Voorbeeld: In bovenstaand voorbeeld klikken we bij “Parent Name” op ‘News Feeds’.
Dit betekent dat we de link “The News” onderbrengen in de link ‘News
Feeds’.
We klikken vervolgens op “Save” bovenaan rechts
We bezoeken nu onze online website, en zien dat de link “The News” is
verplaatst onder ‘News Feeds’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
47
Order: de desbetreffende link komt op plaats ‘x’ in het menu.
Access Level: Hier kun je aangeven voor wie die Link zichtbaar is.
On click, open in:
Parent window with browser navigation: Bij deze keuze zal bij het aanklikken van de
Link, de nieuwe pagina zich openen in hetzelfde (parent) venster
New window with browser navigation: Bij deze keuze zal bij het aanklikken van de
Link, de nieuwe pagina zich openen in een nieuw venster.
Op dezelfde pagina hebben we ook aan de rechterkant van het scherm een aantal menu’s
©2007 pjpprojects.nl >>>PJP Projects Webdesign
48
Parameters-Basic.
We zullen eerst de begrippen Category en Content verderop moeten bespreken alvorens we
hier een zinnig woord kunnen over zeggen.
We laten het hier even bij de opmerking dat je via de dropdown menu bij Category, in staat
bent op content toe te wijzen aan een bepaalde link (in ons voorbeeld de link “The News”)
Parameters-Advanced
Idem als bij Paramaters-Basic
Parameters-Component
©2007 pjpprojects.nl >>>PJP Projects Webdesign
49
Show unauthorized links: Zoals hierboven reeds aagegeven kunnen er links zijn die voor het
brede publiek niet toegangelijk zijn, maar wel zichtbaar. Als je deze functie op “No” zet…zijn
ze ook niet meer zichtbaar
Show Article Title:
De titel “Welcome to Joomla” is zichtbaar (maw “show”)
Title Linkable: Bij “yes” zal er een link worden gekoppeld aan de titel van het artikel.
Als de bezoeker er op klikt dan verschijnt het volledige artikel in een nieuw venster. Dit heeft
het zelfde effect als klikken op “Read more…” (lees meer)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
50
Deze vier functies laten we momenteel links liggen. We dienen eerst de hoofdstukken
betreffende ‘sections’ en ‘categorieen’ te hebben besproken.
Een aantal van deze functies zijn hieronder weergegeven:
Article Raring/Voting: Als die op “show” wordt geplaatst…dan kan de bezoeker een score
geven aan het artikel op de pagina die gekoppeld is aan de link “The News” (althans in ons
voorbeeld)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
51
Tenslotte….
Dit betreft het plaatsen van icons bij artikels :
Hier zie je bovenaan rechts de drie iconen: PDF, Print en E-mail
-PDF: Een PDF bestand wordt gemaakt van het desbetreffende artikel (niet de
volledige pagina)
-Print: Het desbetreffende artikel wordt uitgeprint
-E-mail: De link kan worden ge-emailt naar iemand anders
©2007 pjpprojects.nl >>>PJP Projects Webdesign
52
Bij Page Title brengen we even “Nieuwsblad” in
We klikken op “Save” rechts boven de pagina
Vervolgens bezoeken we onze online website. We klikken op de link “The News”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
53
Als hier zou kiezen voor “Hide” dan zou je de titel “Nieuwsblad” niet zien.
Als je de pagina gekoppeld aan de link “The News” een aparte CSS stijl wil meegeven, kun je
hier een CSS class identificatie geven.
Hier kun je kiezen voor een afbeelding die vóór de naam van de link in het menu komt te
staan. De afbeeldingen moeten op de webserver staan in de map /images/stories.
Hier kun je aangeven of er een beveiligde pagina gekoppeld is aan desbetreffende link.
(SSL = Secure Site Link)
Er rest ons in het bovenste menu bij Main Menu nog 1 icon: New
Dit geeft je de mogelijkheid een nieuwe link aan te maken in het menu.
Echter dit vergt grondige kennis van de begrippen Section en Category.
Dus doorloop eerst even de hoofdstukken betreffende “Content” alvorens je een nieuwe link
aanmaakt.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
54
III.B.4. Overige Menu’s
We hebben zeer uitvoerig het Main Menu beschreven. Dit alles geldt natuurlijk voor alle
andere menu’s
User Menu / Top Menu/ Other Menu/ Example Pages/ Key Concepts
Misschien vraag je je af waar dat “Example Menu “ zit ☺?
Welnu we bezoeken de online website…We klikken op “Example Pages”
Het gevolg is dat een nieuw menu verschijnt:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
55
III.C. Content (Inhoud)
Misschien was het tot nu toe saaie kost ☺. Uiteindelijk draait een website om inhoud.
Welnu, in dit hoofdstuk zullen we het alleen over inhoud (content) hebben. Goed zo ☺?
Joomla ! definieert een artikel (article) als inhoud (content) dewelke een stuk tekst
(geformatteerd dmv HTML) bevat.
Joomla’ artikels worden georganiseerd volgens onderstaande structuur:
(Figuur uit Joomla 1.5 Beta 1 Hagen Graf Packt Publishing)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
56
Voor absolute beginners met Joomla kan deze structuur in den beginne heel onwennig
overkomen. Neem voldoende tijd om dit goed te absorberen. Het is uiterst belangrijk dat je dit
goed in de vingers hebt!!
Je kunt de structuur het best vergelijken met een mappen structuur van een harde schijf.
Voorbeeld: Een bepaald bestand (content) wordt bewaard in een map “category”, dewelke op
zijn beurt weer onderdeel is van een map “section”.
Je kunt zoveel “sections”, “categories” en “artikelen(content)” maken als je wilt.
III.C.1 Article Manager
Deze pagina kunnen we indelen in drie delen :
a)Bovenste menu
b)Overzicht van alle artikels die op onze site staan
©2007 pjpprojects.nl >>>PJP Projects Webdesign
57
c)Onderaan de pagina blijkt dat alle artikelen verspreid staan over 3 pagina’s
Blijkt dus dat er 43 artikels op onze online site staan.
Als je nog steeds twijfelt betreffende de definitie van een artikel, geef ik hier een voorbeeld
genomen uit de online site:
Dit staat op de “home page” van onze online website.
Je ziet een afbeelding van het artikel “Welcome to Joomla!”
Terug naar de “Article Manager”
Boven het overzicht van alle artikels staat een selectiemenu:
Dit maak het je eenvoudiger om een bepaald artikel te zoeken
Je kiest een “section”, een “category”…mogelijks een “author”. Dan geeft “Article Manager”
je een aangepaste lijst van de desbetreffende artikelen.
Archive
We plaatsen een vinkje voor het artikel “What’s New in 1.5?”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
58
Vervolgens klikken we op ‘Archive’
Het artikel “What’s new in 1.5?” staat nu lichtgrijs gekleurd. Tevens duidt het teken
erop dat het artikel niet gepubliceerd is.
Maw ipv een artikel te verwijderen (delete) kun je het archiveren (Archive). Zodoende kun je
het mogelijks later terug plaatsen.
Unarchive
Als je eerder een artikel gearchiveerd hebt, kun je dm “Unarchive” het desbetreffende artikel
terug online plaatsen.
We plaatsen terug een vinkje voor het artikel “What’s new in 1.5?”
We klikken nu op “Unarchive”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
59
We zien dat de tekst terug lichtblauw is. Echter bij de kolom ‘Published’ staat er een rood
kruisje . We klikken op dit rood kruisje.
Edit
Dmv “Edit” kunnen we een bestaand artikel openen en mogelijks wijzigen.
We plaatsen een vinkje voor het artikel “What’s new in 1.5?”
Dit artikel behoort toe tot de “category” ‘The CMS’, dewelke op zijn beurt toebehoort aan de
“section” ‘About Joomla’
Vervolgens klikken we op ‘Edit’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
60
Eindelijk….59 pagina’s ver…en we zien voor het eerste ECHTE Inhoud. Oprechte felicitaties
dat je het zolang hebt vol gehouden. ☺
Ik kan deze pagina nu stap voor stap bespreken, maar..hoe raar het ook klinkt…dit is
tijdverlies☺
Ja..ja..we hebben nu eindelijk inhoud…en dan heb ik het direct over tijdverlies ☺
Wat ik namelijk poog te zeggen is dat we onmiddellijk overgaan naar de volgende knop in het
bovenste menu…namelijk…New
New
We klikken dus op “New”…met de bedoeling een nieuw artikel aan te maken (heerlijk☺)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
61
Nu begrijp je beter mijn laatste opmerking. Dit scherm is namelijk identiek aan het scherm die
je krijgt bij “Edit”.
Maar nu zijn de meeste functies leeg.
Ik wil je orgastisch verlangen om direct je eerste artikel online te hebben niet langer tegen
houden.
Bij Title zet je: Gesmolten ijs
Published: Yes
Front Page: Yes
Section: News
Category: Latest
In de tekst editor breng je dmv copy en paste volgende tekst
Een wat oudere man met veel ervaring in zijn leven, niet bijzonder knap maar wel heel
charismatisch, was samen met mij toeschouwer van een cultureel festijn (wat weet ik niet
precies, maar iets met zang en dans). We kenden elkaar niet en stonden bij toeval in elkaars
nabijheid. Het was donker en het festijn speelde zich af in de buitenlucht. Er hing een
uitbundige, ontspannen, maar ook zwoele sfeer. Af en toe spraken we over wat we zagen,
maar verder niets. In de stiltes tussen het praten door voelde ik de blikken van de man echter
ook op mij gericht. Het maakte me onrustig maar nieuwsgierig tegelijk en af en toe keek ik
even zijn kant op om te zien of ik het me niet verbeeldde. Tot mijn verbazing bleef de man
mij telkens schaamteloos en haast triomfantelijk aankijken. Triomfantelijk op een vrolijke
manier overigens, want zijn ogen twinkelden van plezier als hij me weer betrapte op een blik
die naar hem was gericht. Net alsof hij wist dat ik weer zou gaan kijken en daar gretig op
©2007 pjpprojects.nl >>>PJP Projects Webdesign
62
anticipeerde. De blikken werden zo steeds intenser en gedurfder.. .. Vrolijk en uitdagend was
het en tenslotte barstten we allebei in lachen uit om deze manier van geluidloos
communiceren die we voerden.Het ijs (wat er niet was geweest) was gebroken, gesmolten
zelfs…
Zodoende moet je dit als scherm krijgen:
Klik nu vervolgens op “Save” rechts bovenaan
Vervolgens bezoek klik je op “Preview” (rechts bovenan)
En daar staat ons eerste bericht op de Front pagina!!!
Gefeliciteerd!!!!!!
©2007 pjpprojects.nl >>>PJP Projects Webdesign
63
De tekst valt wel wat lang uit. We passen daar een mouw aan…
Ga via het menu naar Content>Front Page manager
©2007 pjpprojects.nl >>>PJP Projects Webdesign
64
Dit is een overzicht van alle artikels die op de Frontpage (Home page) staan.
Klik op “Gesmolten ijs”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
65
Na de woorden ….wat we zagen, maar verder niets….plaatsen we de muis door een linker-
klik
Vervolgens klikken we onderaan de pagina op “Read More”
Zie de rode lijn die aangeeft dat er een “read more” link is toegevoegd.
Klik nu op “Save” rechtsboven.
Als je nu afvraagt wat het effect is, bezoek dan je even je online website.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
66
Alleen het eerste stukje van de tekst staat nu op de Frontpage. Bij het klikken op “Read More”
krijg je de rest van het artikel in een nieuw venster.
We hebben er tot nu toe voor gezorgd dat je snel je eerste artikel online gekregen hebt…
Nu gaan we even in detail kijken wat er allemaal verder op het scherm staat.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
67
Author: Als er meerdere personen artikelen voor je website, kan hier de auteur van het artikel
gekozen worden
Author Alias: Hier kan de auteur mogelijks een Alias ingeven. Het is het Alias die op de
website verschijnt.
Access Level: Hier geef je aan door wie het artikel kan worden gelezen.
Created Date: Hier kun je de datum invullen op dewelke het artikel is geschreven.
Je kunt op agenda-icontje klikken naast de datum
Zodoende kun je de datum van publicatie aan klikken.
Start Publishing: Mogelijks heb je een artikel geschreven waarvan je wil dat pas later online
verschijnt. Hier kun dus de datum aangeven vanaf dewelke het nieuwe artikel online moet
verschijnen.
PS: Je kunt hier ook gebruik maken van het agenda-icontje.
Finish Publishing: Mogelijks wil je hier al ingeven dat een artikel vanaf een bepaalde datum
niet meer online moet staan.
Als je Never ingeeft, zal het artikel er steeds staan tenzij je het manueel gaat verwijderen (zie
Archive hierboven)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
68
Show Title: Bij Show wordt de titel getoond. In ons voorbeeld: Gesmolten ijs
Title Linkable: Bij Yes wordt een link verbonden aan de Titel. Als de bezoeker er op klikt,
wordt een nieuw venster geopend.
Intro Text: In ons voorbeeld “gesmolten ijs” werd bij klikken op “Read More” het vervolg
van de tekst getoond in een nieuw venster. Het stukje tekst dat reeds op de Frontpage
(HomePage) stond werd niet herhaald. Als je hier “Show” inbrengt, dan wordt na het klikken
op “Read More” ook het stukje tekst dat op de Home Page stond herhaald.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
69
Section Name: Als je hier “Show” invult dan komt de Section er bij te staan waartoe het
desbetreffende artikel hoort
Section Title Linkable: Als je hier “Yes” inbrengt dan wordt in ons bovenstaande voorbeeld
een link toegevoegd aan “News”.
Category Title: Dit is identiek als bij de “Section Name”. Als we hier “Show” inbrengen, dan
wordt de “Category” waartoe het artikel behoort weergegeven.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
70
Category Title Linkable: Dan wordt een link toegevoegd aan de “Category”
Article Rating: Als je hier “Show” inbrengt dan wordt een poll toegevoegd aan het artikel.
De bezoeker kan dan punten geven aan dit artikel. De poll is alleen zichtbaar als de bezoeker
klikt op “Gesmolten ijs” ( de titel van het artikel) of op “Read More” (indien beschikbaar)
Hier kun je dus Meta informatie inbrengen, dewelke specifiek toebehoort aan dit artikel.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
71
Descprition: Hier breng je info in die behoort bij meta name”description”
Keywords: Hier breng je info die behoort bij meta name “keywords”
Robots: Hier breng je info die behoort bij meta name “ROBOTS”. Je kunt hier dus invullen
INDEX,FOLLOW
Author: Hier breng je info in die behoort bij met name “author”.
Images/Afbeeldingen
Er zal zeker de vraag zijn om afbeeldingen toe te voegen aan een artikel.
Onderaan de tekst-editor staat een knop “Image”
Een nieuw scherm opent zich:
Hier krijg je een overzicht van alle mappen ondergebracht in de map ‘images’, dewelke
allemaal afbeeldingen bevatten.
Dmv FTP kunnen we inderdaad op de server kijken wat er allemaal in de map ‘images’ staat
©2007 pjpprojects.nl >>>PJP Projects Webdesign
72
We willen een afbeelding toevoegen aan ons artikel “gesmolten ijs”.
We plaatsen eerst de cursus (linker-klik) op de plaats waar we de afbeelding willen hebben.
We plaatsen dus de cursor voor het woord “een”.
Vervolgens klikken we op “Image” onderaan de tekst-editor.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
73
We openen de map “stories”. Vervolgens openen we de map “fruit”. Vervolgens klikken we
op ‘cherry.jpg’.
Bij ‘Align’ kiezen we voor ‘Left’. Zodoende plaatsen we de afbeelding ‘links’
Nu klikken we op ‘Insert’ linksboven het scherm.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
74
Nu vergeten we niet de klikken op “Save “ rechtsboven.
De pagina “Article Manager” opent zich.
We kiezen nu voor ‘preview’ rechtsboven.
Het resultaat is:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
75
Als we nu op de link “Gesmolten ijs” klikken:
We keren nu terug naar ons artikel in de Administration back-end.
Als je even de weg kwijt bent..Klik in het bovenste menu op Content>Front Page Manager
Klik vervolgens op Gesmolten ijs
©2007 pjpprojects.nl >>>PJP Projects Webdesign
76
En dan opent zich het reeds eerder gezien tekst-editor venster.
Nu klikken we op de afbeelding in de tekst:
Nu kiezen we voor het afbeeldings-icon in het editor menu
©2007 pjpprojects.nl >>>PJP Projects Webdesign
77
Nu kunnen we de afbeelding verder bewerken.
General
Image description: Dit zorgt voor de invulling van “Alt”. Belangrijk voor een goede score bij
SEO
©2007 pjpprojects.nl >>>PJP Projects Webdesign
78
Appearance:
Alignment: Dit is het zelfde als de knop ‘Align’ die we eerder hebben gezien. Hiermee plaats
je de afbeelding tov de tekst
Dimensions: Hiermee kun je in principe de afmetingen van de afbeelding veranderen. Ik raad
dit ten sterkste af. Als je afmetingen wil veranderen gebruik dan een foto-bewerkings
programma zoals Photoshop.
Vertical space/ Horizontal Space: Met vertical space voeg je extra ‘witte ruimte’ toe boven en
onder de afbeelding. Met ‘horizontal space’ voeg je extra ‘witte ruimte’ toe links en rechts
van de afbeelding. Breng even in beide vakjes de waarde 10, en kijk wat er met het ‘boompje’
gebeurt in de voorbeeld afbeelding
.
Border: Zo kun je een boord toevoegen rond de afbeelding
©2007 pjpprojects.nl >>>PJP Projects Webdesign
79
Class: Hier kun je een caption toevoegen aan de afbeelding
Advanced:
Hier kun je de URL van andere afbeeldingen geven. Als de bezoeker met zijn muis over de
oorspronkelijke afbeelding beweegt, verschijnt er een andere afbeelding.
We zijn 20 pagina’s terug (pagina 55) begonnen met de bespreking van de Article Manager.
Op pagina 58 zijn we begonnen met de bespreking met de knop ‘New’ (aanmaken van een
nieuw artikel)
Welnu in het bovenste menu bij ‘Article manager’ is er nog 1 knop te bespreken.
Preferences
Na klikken op deze knop verschijnt volgend extra scherm:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
80
Het zal je ongetwijfeld zijn opgevallen dat bij een aantal besproken drop-down menu’s er
staat “Use Global”
Voorbeeld (ook terug te vinden op pagina 67)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
81
Welnu de “use global” instellingen worden gedefinieerd dmv de “Preferences” button.
Even een voorbeeld ter illustratie
Dit is een stukje van het volledige “Preferences” scherm
Voor auteurs-naam (Author Name) staat “Show” (tonen).
Als je nu ergens bij de aanmaak van een nieuw artikel een menu ziet met titel “Author
Name”, dan kun je daar “Use Global” kiezen. Maw je kiest voor “Show”.
Dus als ergens “Use Global” staat dan kun je werkelijke waarde van die parameter terug
vinden in de “Preferences”.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
82
III.C.2 Article Trash
Als je via de Article Manager een artikel in de prullenbak (Trash) hebt gegooid, dan kun je
deze via de Article Trash Manager terug op halen
III.C.3 Section Manager
We hebben op pagina 54 de inhoudelijke structuur van Joomla besproken. We geven ze hier
nogmaals schematisch weer:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
83
Artikelen (content) behoren tot een bepaalde Category. Deze laatste behoren dan bij een
bepaalde “Section” (sectie)
Met de “Section Manager” beheren we deze Sections.
We klikken op Content>Section Manager
De opbouw van deze pagina is heel gelijkaardig aan voorgaande pagina’s.
We hebben een horizontaal menu met grafische knoppen (Publish, Unpublish, Copy,…)
Daaronder hebben we een overzicht van alle “Sections”. Zoals je kunt zien bezit onze site 3
‘sections’ (About Joomla, News en FAQs)
We klikken op de “Section” ‘About Joomla’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
84
Hier kun je de titel van de section opgeven, alsook of de desbetreffende section toegangelijk
is voor alle bezoekers, geregistreerde bezoekers of gebruikers (users/Special)
Via Description kun je ook een beschrijving geven aan de “Sections”.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
85
III.C.4 Category Manager
Identiek aan de “Section Manager”…maar nu voor het overzicht van alle Categorieën
We klikken op de “The Project”.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
86
Title: De titel van de Category, zoals ze verschijnt op de website
Section: Hier geef je aan tot welke Section deze Category hoort
Access Level: Wie heeft toegang tot deze Category?
Image: Om het effect daarvan te zien, kiezen we voor de afbeelding key.jpg
©2007 pjpprojects.nl >>>PJP Projects Webdesign
87
Vervolgens kiezen we bij Image Position (positie) voor “Left” (links)
Onthou ook even de tekst die bij “Descriptions” staat (General facts about Joomla)
We klikken nu “Save” – rechtsboven
Nu klikken we op preview – rechtsboven
Dan komen we terecht op de online website
Klik op “More about Joomla”
Klik nu op “The Project”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
88
Nu zie je de positionering van de afbeelding “key.jpg”. Je ziet ook de tekst staan dewelke was
opgenomen in “Description”.(General facts about Joomla)
III.C.5. Front Page Manager
©2007 pjpprojects.nl >>>PJP Projects Webdesign
89
Zodoende krijg je een overzicht van alle artikelen die op de Front Page (Home Page) staan.
Je ziet ook het artikel (Gesmolten ijs) staan die we zelf hebben toegevoegd.
Aan de hand van “Order” kun je de volgorde van de artikelen op de Home Page bepalen.
Als je op de naam van het artikel klikt opent zich onmiddellijk de inhoud van desbetreffend
artikel.
III.C.6. Item aan menu toevoegen
We hebben in hoofdstuk II bij de bespreking van menu’s aangegeven dat het aanmaken van
een nieuwe link in een menu pas begrijpbaar is als we de begrippen Section en Category
hebben besproken.
We zijn nu zover.
Tot vervelens toe herhalen we nogmaals dat de echte inhoud van een joomla website
geschreven wordt dmv artikelen (Articles). Deze worden verzameld binnen diverse
categorieën (Category). Deze laatste worden op hun beurt dan weer ondergebracht in diverse
“Sections”.
Laat ons die structuur nog eens illustreren met een voorbeeld.
Bezoek even de homepage van de online website.
Klik dan even op “FAQ” in het hoofd menu (Main Menu)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
90
Vervolgens krijg je de volgende pagina:
Dit is de Section pagina.
De online site heeft namelijk een “Section” FAQs (controleer maar even bij Content>Section
Manager)
Je ziet dus de titel van de Section in het vet staan (FAQs)
Daaronder zie je een lijst staan van alle Categorieën (Category) die deel uitmaken van de
Section “FAQs”.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
91
In totaal zijn er dus 4 Categorieën in de Section “FAQs”.
Als je nu (als voorbeeld) klikt op de Category “General”, dan krijg je volgend scherm:
Dit is een overzicht van alle artikelen (Articles) die deel uitmaken van de Category “General”.
Als je nu op de eerste lijn klikt (Is it possible….entries?), dan krijg je de inhoud te zien van dit
artikel
Als je straks dus zelf een Joomla website gaat maken, moet je echt eerst en vooral goed
nadenken over de structuur van je site.
Hoeveel en welke “Sections” wil ik?
Wat zijn de categorieen binnen iedere “Section”?
©2007 pjpprojects.nl >>>PJP Projects Webdesign
92
Stel je wil een site gaan maken om door jouw gemaakte juwelen te verkopen.
Dan zou je volgende tabel kunnen maken
Section Category
Bedrijf Bedrijfsinfo
Bedrijfsnieuws
Juwelen Oorbellen
Armbanden
kettingen
Nieuwe produkten
Klanten Bestellen
Recenties
Nu kun je steeds Artikelen blijven schrijven die je vervolgens eenvoudig toevoegt aan één van
de categorieen cq. “Sections”
Daarnaast heb je dan algemene pagina’s die geen section of category behoeven, zoals ‘Links’
, ‘Contact’, Home.
Het is dus voor zeer groot belang (!!!!) dat je eerst een goed gedefinieerde structuur hebt van
je toekomstige website. Persoonlijk maak ik daar zelfs steeds een tekening (organigram) van.
Een menu is het belangrijkste hulpmiddel van een bezoeker om die structuur van je website te
zien…en vervolgens eenvoudig te komen waar hij/zij wil zijn in die structuur (Voorbeeld:
Juwelen>Oorbellen).
Persoonlijk adviseer ik dan ook (het is geen ‘must’!) om je hoofdmenu (Main Menu) parallel
te laten lopen met je “Sections”. Dat maakt het voor jou en de bezoeker, me dunkt, het meest
logisch.
Als je een menu-link toevoegt dan weet je (hopelijk☺) wat je met de extra link wil:
-je wil een pagina toevoegen waarop straks meerdere artikelen komen te staan
-je wil een pagina toevoegen waarop één (1) artikel komt te staan
-je wil een pagina toevoegen met een overzicht van diverse sub-links
(Een mooi voorbeeld is de pagina “FAQs” of “General” zoals hierboven beschreven)
-je wil met de link een andere website aanroepen
©2007 pjpprojects.nl >>>PJP Projects Webdesign
93
Deze voor de hand liggende wetenschap moet je goed in het achterhoofd houden bij het
aanmaken van een nieuwe link in een menu.
Daar gaan we ☺
We gaan naar Menu>Main Menu
Daar krijg je een overzicht van alle links die in het hoofdmenu staan:
We klikken nu op “New” in het bovenste menu
©2007 pjpprojects.nl >>>PJP Projects Webdesign
94
De meest makkelijke is “External Link”. Als je daar op klikt dan krijg je de mogelijkheid een
naam (Title) en URL(Link) in te brengen naar een externe site.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
95
Onder ‘Internal Link’ staan een hele reeks ‘sub-links’ (Articles, Contacts, News Feeds,…)
Als je nu op één van die sub-links klikt opent zich weer een reeks keuze mogelijkheden.
Klik bijvoorbeeld even op ‘Articles’
Zo krijg je dus een grote hoeveelheid aan keuze mogelijkheden.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
96
Met de hieronder beschreven keuzemogelijkheden kun je mijn inziens 95% van alle courante
website pagina’s invullen.
Articles
Bij het kiezen van ‘Aricles’ wil je dus op één of andere manier een link leggen naar een
artikel.
Archive
Dit zie je vaak in weblogs. Oudere posts (artikels) worden bewaard onder de rubriek
‘Archive’.
Als je hier (Archived Article List) op klikt , dan krijg je onderstaand scherm:
Het lijkt mij logisch dat je als Titel (Title) geeft: Archive of Archief.
Je ziet ook dat Joomla al een link (archive) heeft toegekend.
De artikelen die gearchiveerd zijn (zie Article Manager) zijn hier te bekijken en kunnen
worden gezocht op basis van datum.
Article
Als je kiest voor ‘Article Layout’ dan wil je dat een link wordt gelegd naar één bepaald
artikel.
We klikken even op deze link
©2007 pjpprojects.nl >>>PJP Projects Webdesign
97
Dmv Title (Titel) kun je een naam geven aan de link.
Je ziet dat de link reeds door Joomla is ingevuld.
Als je nu even rechts bij Parameters-Basic gaat kijken dan kun je een artikel selecteren die wil
linken.
Klik op ‘Select’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
98
Dan krijg je een overzicht van alle geschreven artikelen, inclusief de bijhorende “Section” en
“Category”.
Hoe gaat je webpagina er dan uitzien?
(Voor een vergrote weergave klik op de afbeelding)
Zoals je kunt zien krijg je dus een pagina waarbij één (1) artikel staan (inclusief de menu’s)
Je kunt er natuurlijk voor kiezen om de naam van de auteur, de datum van aanmaak en de
datum van last update (laatste aanpassing) weg te laten (zie Article Manager)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
99
Category
Hier willen we dus een link maken naar een “Category”
Bij Category hebben we 2 keuzes
Herinner dat een “Category” een reeks artikelen (Articles) bevat.
Bovenstaande keuze laat u toe deze artikelen op 2 manieren weer te geven.
In beide gevallen maak je dus één link naar een pagina die een samenvatting is van een
category (=een aantal artikelen)
Bij ‘Category Blog Layout’ krijg je volgende layout
(voor een vergrote versie klik op de afbeelding)
Herinner je de beschrijving die we in het begin van het hoofdstuk hadden betreffende de link
“FAQ”.
Wat je hier dus ziet is de Category “General” onder de “Section” FAQ.
Alle artikels worden er weergegeven, inclusief de inhoud van het artikel. In bovenstaand
voorbeeld zijn het allemaal zeer korte artikels. Stel dat jee nlanger artikel hebt, dan kun je bij
de opmaak van het artikel een “Read More (Lees Meer…)” link maken.
Als je op de link ‘Category Blog Layout’ klikt, dan krijg je volgende pagina:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
100
Bij Title(Titel) kun je weerom een titel van je link ingeven.
Je ziet dat Joomla weerom reeds een URL heeft ingebracht bij ‘Link’.
Het menu rechts (Parameters-Basic) is uiterst interessant en belangerijk
Category: Daar kun je dus de Category kiezen naar waar gelinkt moet worden.
Description: Daarvoor moet je terug naar het hoofdstuk ‘Content’, meer bepaald ‘Category
Manager’. Daar hebben we geleerd hoe je bij de aanmaak van een ‘Category’ een
‘Descprition’ (omschrijving) kon inbrengen. Hier kun je aangeven of je die omschrijving wilt
tonen of niet
©2007 pjpprojects.nl >>>PJP Projects Webdesign
101
Description image: Bij het maken van een Category hebben we aangegeven dat je ook een
afbeelding kunt opladen voor één “Category”. Hier kun je aangeven of je die wil laten zien.
#Leading: Bekijk even het voorbeeld op pagina 98. Het eerste artikel (Is it possible to
change….entries?) staat over de volledige breedte van het scherm. Alle andere artikels staan
in 2 kolommen. De Leading is dus “1”. Maw het eerste artikel is de volledige breedte.
Als je ‘Leading’ ‘2’ zou invullen betekent dit dat de 2 eerste artikelen de volledige breedte
hebben.
#Intro: Bekijk terug het voorbeeld op pagina 98. Onder het ‘Leading’ artikel staan er 4
artikels met de inhoud. Dus “intro” is gelijk aan 4.
#Columns: De 4 artikels zijn weergegeven in 2 kolommen
#Links: Dit zie je dus niet op pagina 98 ☺. Maar onderaan de pagina zoals weergegeven op
pagina 98 zie jet het volgende:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
102
Bovenstaande afbeelding is het verlengde van pagina 98.
Onderaan zie je bij ‘Read More’ 3 extra links naar bijkomende artikelen staan, maar ze zijn
opgenomen in de kolommen en hebben geen tekst van de artikelen.
Met ‘#Links” geef je het maximum aan links die hier bij ‘Read More’ mogen komen te staan.
Als er meer artikelen zouden bestaan dan zal Joomla een extra pagina aanmaken (knap toch
☺☺)
Bij ‘Category List Layout’ krijg je volgende webpagina:
(voor een vergrote versie, klik op de afbeelding)
Nu krijg je dus een lijst van Artikelen die behoren bij de Category “General”.
De bezoeker moet nu op een Artikel klikken om de Full Screen inhoud te zien.
Als we op de link ‘Category List Layout’ klikken:
dan krijgen we volgende pagina:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
103
Weerom kun je een titel(Title) van de nieuwe link opgeven.
Weerom heeft Joomla al een URL toegekend bij ‘Link’.
Bij Parameters-Basic(rechts) kun je inbrengen:
Category: Kies hier de Category naar de welke je wil linken
Table Headings: De Table Heading is ons bovenstaand voorbeeld is:
Met ‘Show’ toon je die. Met ‘Hide’ niet.
Date Column: Met deze optie kun je een extra kolom toevoegen waarbij de datum van
aanmaak van het artikel wordt getoond.
Filter: Bij ‘Show’ komt er een filter functie boven de tabel te staan.
Voorbeeld:
Filter field: Daarbij geef je aan op welk veld gefilterd kan worden.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
104
Front Page /Front Page Blog Layout
Dit is identiek aan de Category Blog Layout, met dit verschil dat het hier de Front (Home)
Page (pagina) betreft. Maw de artikelen gekoppeld aan de Front(Home)Page zullen getoond
worden in blog layout.
Als je de Home page van onze online website bekijkt (zie afbeelding hieronder) dan zie je dat
deze is opgemaakt in blog formaat ( 1 “leading” artikel, 2 kolommen,…)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
105
Section
Hierbij zijn weerom 2 mogelijkheden:
We verwijzen hierbij terug naar het “FAQ” voorbeeld dat we uitvoerig hebben beschreven op
pagina 89.
Als we op de link “FAQ” klikken in het hoofd menu (Main Menu) dan opent zich een
‘section’ pagina met een overzicht van alle categorieen.
Als je dus bij ‘Select Menu Item Type’ kiest voor ‘Section’ wil je dus een link maken naar
een pagina die info bevat betreffende een “Section”.
De inhoud van die “Section” kun je, naar analogie met “Category”, weerom weergeven op 2
manieren:
- Blog Layout
- Section Layout
(PS: Hier is Joomla niet consistent: Bij Category noemen ze dit de ‘Category List
Layout’, terwijl ze bij ‘Section’ over een Section Layout spreken (zonder ‘list’))
Section Layout
Ik wil hierbij eerst even beginnen met ‘Section Layout’.
We hernemen hierbij ons voorbeeld van “FAQ”.
Hier zie je een overzicht van alle Categorieen, met daarbij tussen haakjes de hoeveelheid
artikelen .
©2007 pjpprojects.nl >>>PJP Projects Webdesign
106
Section blog Layout
Als we nu deze layout zouden kiezen voor de link (section) “FAQ”, dan zou die er zo uitzien:
Als je deze pagina verder naar beneden scrollt zie je onderaan van de pagina:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
107
Laat ons even beginnen met de afbeelding op pagina 105.
Heb je onmiddellijk door?? Bij deze layout worden de categorieen (Category) helemaal niet
weergegeven…maar direct de inhoud van ALLE artikels uit ALLE categorieen.
Op de afbeelding hierboven zie je:
- onderaan worden een aantal links opgegeven naar artikelen, zonder de inhoud op te
geven van het artikel (alleen links)
- Alle artikelen uit alle categorieen zijn verdeeld over 3 pagina’s. Je kunt van de ene
naar de andere pagina surfen.
Als we nu op de ‘links’ “Section Blog Layout klikken”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
108
opent zich een venster die bijn identiek is aan het venster (menu) die we hadden bij ‘Category
Blog Layout’ (pagina 99)
Contacts
Vervolgens hebben we in de lijst van ‘Select Menu Item Type’ de keuze ‘Contacts’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
109
Als we klikken op ‘Contacts’ dan krijgen we:
Alvorens dit (en wat volgt) te begrijpen moeten we een sprongetje maken naar de rubriek
‘Contact’ dewelke te vinden is in het hoofdmenu onder ‘Components’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
110
Hier zien we terug de Joomla filosofie terug betreffende het gebruik van “Category”.
Misschien gaat u ervan uit dat er op een website maar 1 contact formulier of 1 contact (=e-
mail) adres is. Joomla gaat ervan uit dat er meerdere ‘contacts’ kunnen zijn.
Logisch want Joomla laat toe dat er meerdere ‘auteurs/gebruikers’ (authors/users) werken aan
de website.
Ieder van die gebruikers/auteurs kan zijn eigen contact informatie (formulier) plaatsen.
Onderstaand voorbeeld is genomen uit een Joomla website van een jeugdbeweging:
Afhankelijk van welke groep je wil contacteren kun je een ander contact formulier kiezen.
Telkens krijg je een contact-formulier te zien
©2007 pjpprojects.nl >>>PJP Projects Webdesign
111
Dus je dient eerst voor ‘Contacts’ een Category te hebben.
We klikken op ‘Contacts>Categories’
We zien dat er 1 Category aanwezig is (met naam ‘Contacts’)
Als we nu klikken op de category ‘Contacts’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
112
Ik mag hopen dat de opbouw van dit scherm intussen heel vertrouwd overkomt ☺
Hier kun je dus gegevens betreffende de Category ‘Contacts’ aanpassen.
We keren nu terug naar vorig menu:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
113
We klikken nu op ‘Contacts’ (links-boven)
We zien via de ‘Contact Manager’ dat er 1 contact is toegevoegd met de zeer originele naam
‘Name’
We klikken nu op ‘Name”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
114
Je ziet dat er hierbij heel wat informatie kan worden ingebracht.
Joomla voorziet de mogelijkheid om naast een e-mail contact formulier ook andere
(persoonlijke) gegevens op de website plaatsen (adres, telefoon, GSM, Fax, Website,…)
In de rechterkolom kun je nu aangeven of je al die informatie ook zichtbaar (Show) wil
hebben.
Let wel: Als je bijvoorbeeld geen Fax nummer invult, maar in de rechterkolom ‘show’ hebt
staan bij Fax…dan krijg je op de website wel Fax te zien maar zonder nummer. Als je dus de
rubriek Fax helemaal niet op je site wil, dan moet je voor ‘Hide’ kiezen.
Nu dat we weten dat er bij ‘contacts’ ook ‘Categorieen’ bestaan, kunnen we terug naar de
keuze ‘Contact ‘ bij ‘Menu Item Type’ (pagina 108)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
115
Contact Category Layout
Hier maak je een layout waarbij ALLE contacts binnen een bepaalde Contact-Category
worden weergegeven.
Een voorbeeld hiervan hebben we gegeven op pagina 109 (jeugdbeweging-website)
Standard Contact Layout
Hierbij zal 1 contact (contact-formulier) op de webpagina worden weergegeven.
Let wel: Als je dus een link ‘contact’ in je menu wil toevoegen (onafhankelijk van de gekozen
layout – Contact Category Layout of Standard Contact Layout), moet je er wel EERST voor
zorgen dat je contact-category en je contact(s) zijn aangemaakt in ‘Components>Contacts’
(pagina 110)
Search
©2007 pjpprojects.nl >>>PJP Projects Webdesign
116
Hierbij kun je een link maken in je menu die gekoppeld is aan een Search.
Hierbij is er gekozen voor de extra mogelijkheid om specifiek te zoeken bij Articles
(Artikelen) ,Web links, contacts,….
Deze extra zoek functie kun je activeren door in de rechterkolom een ‘’Yes’ te plaatsen bij
‘Use Search Areas’
Web Links
Iedere website of weblog heeft een pagina waarbij een verzameling ‘Links’ worden
weergegeven. Deze links verwijzen naar bevriende of analoge websites waar meer of andere
info kan worden gevonden.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
117
Kijk maar even op www.Web-garden.be. Dan vind je in het hoofdmenu een link naar ‘Links’.
Hier geldt dezelfde logica als bij ‘Contacts.
We hebben daar gezien dat er eerst een contact-category moet worden gemaakt, en vervolgens
een contact wordt aangemaakt die behoort bij een welbepaalde contact-category.
Bij ‘Web links’ is het idem dito.
Je moet eerst een links-category aanmaken , en vervolgens een link definiëren die behoort tot
een bepaalde links-category.
Om de desbetreffende Categorieen en links aan te maken , moeten we terug naar de rubriek
‘Components’ in het hoofdmenu.
Voor het maken van een web-link layout, kun je vervolgens kiezen uit 3 mogelijkheden:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
118
a)Web Link Category List Layout
Hierbij maak je een link naar een pagina met een overzicht van alle weblinks-categorieen
b)Category List Layout
Hierbij maak je een link naar een pagina met een overzicht van weblinks binnen 1 weblink-
category.
c)Web Link Submission Layout
Hierbij maak je een link naar een pagina waarbij een geregistreerde bezoeker een weblink kan
toevoegen.
Wrapper
Dmv de wrapper layout kun je een externe webpagina laden in je eigen website.
External Link
Dit is misschien wel de meest eenvoudige toepassing. Hier kun je dus een link toevoegen an
je menu, die direct verbinding geeft met een externe website/pagina.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
119
III. D. Components
III . D. 1 Banners
Banners zijn advertenties onder de vorm van afbeeldingen. Joomla heeft een uitgewerkte
functie die het plaatsen en beheer van dergelijke banners toelaat.
En ze pakken het heel professioneel aan ☺
Joomla gaat er vanuit dat je diverse klanten hebt die jou betalen voor het plaatsen van
advertenties op je website (ik hoop het voor jou ☺)
Bij de functie ‘banners’ heb je drie sub-keuzes:
1)Clients
Dmv deze functie kun je al je klanten beheren ☺
©2007 pjpprojects.nl >>>PJP Projects Webdesign
120
Momenteel staat er dus slecht 1 klant in…met naam “Open source Matters’
We klikken daar even op
Dit is dus een veredeld fiche systeem, waarop je de klanten info stockeert.
2)Categories
Zoals quasi overal binnen Joomla wordt er ook hier gewerkt met Categories.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
121
Alle banners worden dus opgeslagen in een welbepaalde Category
We klikken even op Joomla
We kunnen dus hier de Category een bepaalde naam geven. Al dan niet publiceren, en
aangeven voor wie ze toegankelijk zijn.
PS: Bij Banners wordt dus geen gebruik gemakt van “Sections”
3)Banners
©2007 pjpprojects.nl >>>PJP Projects Webdesign
122
Name(Naam): Hier geef je de banner een naam.
Show Banner: Met ‘Yes’ wordt de ‘Banner’ vertoond op de website.
Sticky: Een banner met het etiket ‘Sticky’ (dus Yes), wordt het eerst vertoond.
Order: Joomla gaat er van uit dat je roterende banners gebruikt. Maw telkens de bezoeker de
pagina (her)bezoekt, ziet hij een andere banner.
Met ‘order’ heef je de positie aan van deze banner aan in het roterende systeem
Category: Hier geef je aan in welke Category de banner moet worden opgeslagen.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
123
Client Name (Naam Klant): Hier geef je de klant op aan wie deze banner behoort
Impressions Purchased: Letterlijk vertaald betekent dit ‘Aangekochte vertoningen’. Maw ke je
kunt met een betalende adverteerder afspreken dat je een baner ‘x’ keert vertoont op je
website. Die ‘x’ breng je hier in.
Als je kiest voor ‘Unlimited’ dan zal de banner ‘eeuwig’ vertoond worden..tot het moment dat
je bovenstaande ‘Show Banner’ op ‘No’ zet.
Click URL: De bedoeling is dat een bezoeker klikt op de advertentie, en vervolgens op de
website van de klant arriveert. Hier geef je de URL op van de website waar de bezoeker moet
uitkomen na klikken.
Clicks: Hier kun je zien hoeveel keer de banner is aangeklikt.
Customer banner code: Dit is wat complexer. Sommige adverteerders willen alleen betalen als
de banner op je website is aangeklikt (Pay per Click) Er bestaan netwerken en programma’s
die de kliks op een advertentie-banner registreren. Hier kun je de URL en code betreffende
het controlerende netwerk ingeven.
Meer info: http://en.wikipedia.org/wiki/Affiliate_Networks
Banner image selector:
Hier kies je de banner afbeelding.
Let wel: De banner afbeeldingen moeten opgeladen worden in de map: images/banners/
Banner images: Hier zie je een afbeelding van de gekozen banner.
III. D. 2. Contacts
©2007 pjpprojects.nl >>>PJP Projects Webdesign
124
Dit stukje hebben we reeds uitvoerig beschreven op pagina 109
III. D. 3 News Feeds
News Feeds is specifiek interessant voor iemand die een Joomla site wil maken die RSS
ondersteunt.
Om een idee te krijgen waarover het gaat, bezoeken we even onze online website.
We klikken op News Feeds in het Main Menu (hoofd menu)
Dit is een overzicht van de onderwerpen binnen News Feeds.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
125
We klikken op Joomla.
Nu op ‘….Community News’
Wat is er nu zo speciaal??? Welnu, de bovenstaande artikels heb je” zelf niet geschreven maar
zijn overgenomen van een andere website. En in feite dmv copy and paste geplaatst op jou
website.
De website die deze artikels ter beschikking stelt doet dit door dmv een RSS feed.
We gaan nu terug naar de Administrator back-end, en naar de functie
Components>News Feeds>Feeds
©2007 pjpprojects.nl >>>PJP Projects Webdesign
126
Hier zie je nu een overzicht van alle News Feeds.
Ieder van deze is gekoppeld aan een website dewelke een RSS Feed heeft.
Als voorbeeld klikken we even op “Business News”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
127
Name: Naam van de News Feed
Category: Ook de News Feeds worden opgeslagen in een bepaalde News Feeed – Category
Link: Dit is de URL naar de website die via een RSS Feed artikels en nieuws ter beschikking
stelt.
http://headlines.internet.com/internetnews/bus-news/news.rss
Dergelijke URL’s verwijzen meestal naar een bestand met extensie .rss
III. D. 4 Polls
Via dit menu krijg je een overzicht van de gemaakte Polls
We klikken op “Joomla is used for?”
©2007 pjpprojects.nl >>>PJP Projects Webdesign
128
Title: Hier kun je een titel geven aan de Poll. Dit titel komt op ook op je website te staan.
Lag: Dit is het aantal seconden dat een bezoeker moet wachten alvorens hij/zij nogmaals mag
stemmen.
Options: Daar krijg je de antwoorden tussen welke de bezoeker kan kiezen?
©2007 pjpprojects.nl >>>PJP Projects Webdesign
129
III. E. Extensions
III.E.1 Install/Uninstall
Hier kun je allerlei extensies (pug-ins en components), dewelke je extern gevonden hebt,
installeren of de-installeren.
Daarbij horen ook nieuwe templates (layouts) of een ander talenpakket.
Bovenstaand menu lijkt mij behoorlijk vanzelfsprekend.
Je hebt via het internet een extensie gevonden en gedownload op je harde schijf
Dmv ‘bladeren’ zoek je de gedownloade bestanden op je harde schijf. Vervolgesn klik je op
‘Upload File & Install’.
Tip: Op http://extensions.joomla.org vind je een zeer goed overzicht van beschikbare
extensies.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
130
Er wordt teven aangegeven of de extensie compatibel is met Joomla 1.5
Via Install kun je dus ook een ander talenpakket opladen.
III.E.2 Module Manager
©2007 pjpprojects.nl >>>PJP Projects Webdesign
131
In bovenstaande afbeelding krijg je een overzicht van alle modules die standaard meegeleverd
worden met Joomla.
Een template/layout op zijn beurt houdt al deze modules dan samen in een specifieke visuel
vormgeving.
Er zijn weerom meedere externe modules beschikbaar op het internet:
Voorbeeld: Je kunt er een module vinden die een live-chat box op je website plaatst.
Alle beschikbare menu’ s vormen ook modules. Je hebt dus de module ‘Main Menu’, ‘User
Menu’,…
We hebben reeds uitvoerig besproken hoe je een link toevoegt aan een menu. Via een module
kun je nu bepalen waar het menu moet geplaatst worden en hoe een menu er moet uitzien.
Alvorens we beginnen met het bespreken van een aantal modules, spitsen we ons toe op het
begrip ‘position’ (positie) van een module. Verder zullen we bij de bespreking van een
module telkens zien dat we de positie (position) van een module kunnen opgeven.
Joomla kent een aantal voor-gedefinieerde posities. Deze posities zijn specifiek voor een
bepaalde layout/template.
We gaan via het hoofdmenu naar Extensions>Template Manager
We klikken op Template Manager
Er zijn 2 templates (layouts) beschikbaar. De template ‘rhuk_milkyway’ is actief (zie ster bij
‘Default’)
©2007 pjpprojects.nl >>>PJP Projects Webdesign
132
We klikken op ‘rhuk_milkyway’
Nu klikken we op “Preview’
(klik op bovenstaande afbeelding voor een vergrote versie)
Dmv rode tekst zijn de posities binnen deze layout weergegeven.
Bovenaan hebben we de positie ‘top’. Tussen haakjes staat er ‘none outline’, wat aangeeft dat
er geen specifieke omkadering is zoals extra boord of afgeronde hoeken.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
133
Verder zie je de posities : breadcrumb, left, user3 en user 4
Joomla heeft de volgende posities: left, right, footer, top, breadcrumb, user1, user2, user3 en
user4
De posities user1 en user2 zij hieronder weergegeven
Nu kunnen we de verschillende modules bespreken
Breadcrumbs
Breadcrumbs is een navigatietool die de bezoeker vertelt waar hij zich op dit moment bevindt
binnen de website.
Voorbeeld:
©2007 pjpprojects.nl >>>PJP Projects Webdesign
134
De bezoeker heeft via de Home Page (Home) geklikt op ‘The News’ en vervolgens geklikt op
het artikel ‘We are Volunteers’ (wij zijn vrijwilligers)
In de Module Manager klikken we nu op ‘Breadcrumbs’
Je kunt er de desbetreffende module een ‘title’ (Title) geven.
De positie is ‘breadcrumb’.
Via ‘Menu Selection’ kun je aangeven bij welke menu’s de breadcrumb module moet worden
gebruikt. Hier is gekozen voor ‘Alle’
Bij ‘Module Parameters’ (rechterkolom), kun je aangeven dat de breadcrumb steeds moet
beginnen met ‘Home’ (Show Home:Yes)
Text for Home entry: De breadcrumb begint met in ons geval steeds met ‘Home’. Maar in het
plaats van het woord ‘Home’ zou je hier kunnen zetten ‘Beginpagina’.
Footer
Webdesigners verwijzen met ‘Footer’ steeds naar wat er onderaan een webpagina wordt
geplaatst.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
135
Banners
De banner wordt geplaatst in de positie ‘footer’..maw onderaan de pagina.
Target: Als een bezoeker op de banner klikt, wordt hij/zij doorgelinkt naar de website van de
adverteerder. Hier kun je aangeven of deze website zich moeten openen in hetzelfde venster
als jou website, of als er een nieuw venster moet worden geopend (nieuw tabblad voor FF of
IE7)
Banner Client: Hier geef je de adverterende klant op (zie pagina 118)
Randomize: Vrij vertaald “Volgorde”.
-Sticky, ordening: De banners gedefinieerd als ‘sticky’ worden eerst getoond, gevolgd
door de andere banners. De volgorde van tonen is gedefinieerd bij ‘banners’
-Sticky, randomize: De banners gedefinieerd als ‘sticky’ worden eerst getoond. De
andere banners worden getoond in willekeurige volgorde.
Header Text: Tekst die de banner voorafgaat
Footer Text: Dit is tekst die mogelijks na de banner komt.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
136
Main Menu
Het PHP programma mod_mainmenu wordt gebruikt voor het plaatsen en beheren van alle
menu’s.
Menu Style:
-List: Dan krijg je alle links in het menu als een lijst, maw inclusief het bolletje of
ander symbool
-Legacy-Vertical: Dan krijg je alle links in het menu onder elkaar, maar zonder de
bolletjes of ander lijst symbool.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
137
-Legacy-Horizontal: Dan krijg je alle links in het menu op 1 horizontale lijn
Statistics
Zoals je kunt vast stellen is deze module niet actief bij installatie;
Met Statistics kun je info geven betreffende je server.
Met de Hit Counter kun je dus een bezoekersaantal weergeven op je site.
Met increase Counter kun je de het weergegeven aantal wat vervalsen ☺☺
Login Form
Met het Login Form kan een gebruiker(user) zich inloggen, waardoor hij mogelijks website
inhoud kan toevoegen of aanpassen.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
138
Gewone bezoekers kunnen zich hier mogelijks registreren.
Pre-Text: Dit is tekst die voor het login-form kom te staan.
Post-Text: Hier komt eventueel tekst die na de login form komt
Voorbeeld:
Login Redirection URL: Hier kies je waar de bezoeker/gebruiker naar wordt doorverbonden
bij inloggen
Logout Redirection URL: hier kies je waar de bezoeker naar toe moet als hij/zij uitlogt.
Greeting: Als de bezoeker inlogt kun je de tekst “Hello, [username]” laten verschijnen
©2007 pjpprojects.nl >>>PJP Projects Webdesign
139
Name username: Hier kun je kiezen of de begroeting gebeurt, gebruik makend van de
‘gebruikersnaam’ (username) of van de naam (name)
Related Items
Bij installatie van Joomla is deze module niet geactiveerd. Deze module heeft je de
mogelijkheid om de titels van artikels te tonen die gerelateerd zijn aan een bepaald getoond
artikel. De correlatie is op basis van keywords die ingebracht worden in de metadata.
Polls
Hier activeer je de vertoning van Polls. Je heeft ook aan op welke pagina de poll terecht komt
In bovenstaand voorbeeld dus alleen op de Home Page (Front Page)
Who’s online (wie is online)
Deze module geeft je de mogelijkheid de bezoeker te laten zien wie online is op dit moment.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
140
Je kunt dus kiezen welke info je daarbij wil tonen.
Random Image
Je kunt je website opfrissen door op bepaalde pagina’s afbeeldingen te plaatsen. Daarbij
wordt systematisch een andere afbeelding getoond. Vandaar het woord ‘random’ (willekeurig)
Position: hierbij wordt er voor gekozen om de afbeelding rechts (right) te plaatsen.
Order: Er zijn meerdere modules die rechts (right) worden geplaatst. Met ‘order’ geef je de
volgorde aan. We kiezen hier voor ‘4: Random Images’ . Dit betekent dat de willekeiruge
afbeelding het meest onderaan in de rechterkolom van de site komt te staan
Image Type: Hier kun je kiezen tussen gif, jpg of png. Alle afbeeldingen die gebruikt worden
voor het vertonen van een willekeurige (random) afbeelding moeten dus dezelfde extensie
hebben.
Image folder: Hier geef je de map aan op de server waar de afbeeldingen staan.
Voorbeeld: images/stories . Let wel: je begint de locatie dus niet met een’/’ teken
Link: Je kunt er voor kiezen dat bezoekers op de afbeelding kunnen klikken, en zodoende
doorverbonden worden naar een bepaalde URL. Hier kun je desbetreffende URL ingeven.
Width(px)/Height(px): Hier kun je de breedte (width) en hoogte(height) van de afbeedling
opgeven.
- voor een goede weergave van de afbeelding is het aangewezen dat alle
afbeeldingen dezelfde afmeting hebben.
- Aanpassen van afmetingen doe je het best met een extern foto-bewerkings
programma.
- Het is niet aangewezen om via HTML code de afmetingen van een afbeelding te
veranderen.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
141
Voorbeeld:
Je kunt natuurlijk de titel ‘Random Image’ vervangen door een meer gepaste omschrijving.
Syndication
De Syndication module levert een RSS Feed aan, die door bezokers kan gebruikt worden in
hun RSS programma. Zo worden ze via RSS steeds op de hoogte gehouden van de laatste
berichten op je website.
Hier kun je op Wikipedia iets meer lezen betreffende RSS.
Newsflash
Misschien is het je al opgevallen…maar bij je online website verschijnt er helemaal
bovenaan de pagina, steeds een stukje van een artikel. De getoonde tekst is steeds anders als
je een webpagina opnieuw oproept.
Deze functie wordt beheerd dmv de module ‘Newsflash’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
142
Position:Top
Menu Assignment: Hier is er voor gekozen om de “NieuwsFlash” op alle pagina’s te laten
zien.
Category:Hier geef je de Category weer waar “NewsFlash” zijn stukjes van artikels moet
halen.
Layout: Je kunt hier kiezen tussen een horozontale of verticale weergave.
Read more..link: Moet er bij de ‘NieuwsFlash’ een link weergegeven worden waardoor de
bezoeker de rest van het artikel kunnen lezen.
Article title: Moet de titel van het artikel worden weergegeven?
# of articles? Hier vul je het aantal artikels (in de specifieke Category) in, waaruit Joomla kan
kiezen.
Latest News (Laatste Nieuws)
Dit is o.a. weergeven op de Home Page (Front Page).
De rubriek (module) ‘Latest News’ geeft de laatst gepubliceerde artikels weer.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
143
Position: In dit geval ‘user1’.
Count: Dit is het aantal recente artikels die moet worden weergegeven bij ‘Latest News’.
Order: Hier je de volgorde bepalen
Recently Added First: De meest recente staan van boven in het lijstje
Section ID: Ga even terug naar Content>Section Manager
Open de Section Manager
Dan zie je in de laatste kolom dat iedere Section een ID nummer heeft.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
144
Dit ID nummer kun je nu inbrengen bij Section ID. Dan zal de module ‘Latest News’
specifiek nieuwe artikelen zoeken in die Section.
Je kunt ook meerdere Section ID’s ingeven, dewelke gescheiden zijn door een komma.
Category ID: Idem als Section ID maar dan voor Category’s
Popular
De module Popular heeft een overzicht van de meest populaire artikels. Dit zijn de artikels die
het meest zijn aangeklikt/bezocht door bezoekers.
Search
Deze module beheerst de “Search” (zoeken) functie op de website.
Hier kan de bezoeker de website doorzoeken op basis van en door hem/haar ingebrachte term.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
145
Box Width: Hier geef je de breedte (in pixels) aan van het zoekvenster.
Text: Hier kun je een tekst ingeven die in het zoekvenster staat.
Hier hebben we search vervangen door ‘zoeken’
Search Button:Als je hier ‘Yes’ ingeeft dan krijg je dit:
ER is hier een knop toegevoegd met de tekst ‘zo’
©2007 pjpprojects.nl >>>PJP Projects Webdesign
146
III.E.3 Plug in Manager
Plug in’s zijn een stukje software die een bepaalde taak uitvoeren binnen Joomla. Meestal zijn
er geen verdere specificaties op te geven. Er is de beperking tot het activeren of deacitevern
van de plug-in.
Als je klikt op Extension > Plug in Manager, dan krijg je een overzicht van de geïnstalleerde
plug-ins, alsook welke zijn geactiveerd, en welke gedeactiveerd.
Ik neem er hier even, mijn inziens, de meest belangrijke uit.
Gmail: Indien ingesteld kan een Gmail gebruiker zich inloggen op je Joomla website via zijn
Gmail gegevens.
Page Navigation: Onderaan een pagina zie je soms staan ‘Next’ (volgensde) en ‘Previous’
(vorige). Dit omdat bijvoorbeeld een artikel meerder pagina’s in beslag neemt. Als je die
functionaliteit ter beschikking wil, dan moet ‘Page Navigation’ geactiveerd zijn.
Rating: We hebben gedurende bovenstaande cursus aangegeven dat je een functie kunt
toevoegen waarbij de bezoeker een beoordeling kan geven aan een artikel. Als je überhaupt
van deze functie gebruik wil maken, moet ‘Rating’ geactiveerd zijn.
e-mail cloaking: Met deze module zorg je ervoor dat gebruikte e-mail adressen dmv
Javascript versleuteld worden.Zo zijn deze adressen moeilijk opspoorbaar voor spammers.
Code Hightlighter(GeSHi): Deze module is alleen interessant voor diegene die HTML of
andere code willen verwerken in een tekst
Pagebreak: Deze module heeft je de mogelijkheid om langere artikels ‘uit te smeren’ over
meerdere pagina’s. Pagebreak zorgt er ook voor dat je een kleine inhoudstabel op de pagina’s
krijgt die de bezoeker makkelijker navigeert binnen het lange artikel.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
147
Voorbeeld:
No editor: Met deze module zorg je ervoor dat een gebruiker/user geen echte editor ter
beschikking krijgt voor het aanmaken van een artikel. De gebruiker/user kan alleen “kale”
tekst (zonder opmaak) creëren.
TinyMCE 2.0: Dit is de editor die je reeds in diverse voorbeelden hebt zien verschijnen.
Image
Dit is de module die het mogelijk maakt om bij de aanmaak van een artikel een afbeedling op
te laden.
©2007 pjpprojects.nl >>>PJP Projects Webdesign
148
Vervolgens kun je via de afbeelding knop in de editor ( ) de eigenschappen van deze
afbeelding veranderen.
Read more…(lees meer): Deze module moet geactiveerd zijn om de mogelijkheid te hebben
‘Read more (lees meer)’ toe te voegen aan een artikel.
Blogger XML-RPC API: Met deze plug in, is het mogelijk om te ‘communiceren’ tussen
Blogger en Joomla.
Voor meer info en tutorial, klik hier
©2007 pjpprojects.nl >>>PJP Projects Webdesign
149
III.E.4 Template Manager
De Template Manager heeft een overzicht van alle templates (layouts) die beschikbaar zijn.
Dus bij de installatie van Joomla zie je dat er 2 templates (layouts) zijn mmegeleverd.
Op het internet kun je diverse gratis templates terug vinden. Daar Joomla 1.5 nog maar net
zijn start blokken is vertrokken, is het aantal gratis templates voor Joomla 1.5 nog beperkt.
Op www.Web-garden.be zullen we regelmatig links bij plaatsen van gevonden gratis
templates.
Het opladen van nieuwe templates gebeurt via de Install/Uninstall Manager