Joomla 2.5.x

1. ICT-dag
29 mei 2012
Gent
Bruno Parthoens
Docent Lerarenopleiding
Katholieke Hogeschool Limburg
bruno.parthoens@khlim.be

2. Joomla
voor beginners

4. Tot Joomla 1.5: geen ACL en moeilijke
boomstructuur (zie later)
Voordelen
Geen secties en categorieën meer maar zelf
boomstructuur te bepalen door ontwerper
Access Control List
Joomla 2.5 is long-time release net als de
1.5 (minstens 18 maanden)
Ondertussen is Joomla 3.0 uit maar is
testversie en geen long-time release
(enkel
Joomla 1.6 - 1.7

5. Joomla easy?

6. http://www.gratiscursus.be
http://dropbox.com
Emailadres: beginnersjoomla@gmail.com
Paswoord: joomla123
Voorbeeld:
http://1ict.baso.khlim.be
http://bvl.baso.khlim.be
http://leerplankv.baso.khlim.be/projectburotica
Cursusmateriaal

7. CMS (Content Managment System):
website die volledige klaar is en
aanpasbaar
Ander bekend voorbeeld: DRUPAL
PHP en MySQL maar geen kennis nodig
Volledig gratis
Wat is Joomla?

8. Webruimte
Joomla installatiebestanden
FTP-cliënt
Benodigdheden

9. Offline werken: Je ontwerpt je website
lokaal en publiceert achteraf de bestanden
naar webruimte
Harde schijf (Wampserver nodig op je PC
vermits Joomla ontwikkeld is met PHP en een
MySQL-database)
http://www.wampserver.com
Alle bestanden worden aangemaakt en
geïnstalleerd in de map c:wampwwwjoomla
http://www.zelfstudie.be (Joomla 1)
Mogelijkheden

10. USB-stick (USBwebserver nodig)
http://www.usbwebserver.com
Je maakt je volledige website alzo op je USB-stick
of externe harde schijf
Online werken: Je ontwerpt je volledige
website rechtstreeks op de webserver
Mogelijkheden

11. Webruimte
PHP ondersteunen
MySQL-database aanbieden
Instellingen op de php-database
ondersteunen
Voorbeelden:
One.com
Webreus.nl
http://www.1freehosting.com/
000webhost.com (volledig gratis met cPanel om
databases, subdomeinen,… aan te maken)
Benodigdheden

15. Joomla installatiebestanden
http://www.joomladownloads.nl/
filmpje
Maak een mapje Joomla aan op je harde
schijf en pak de bestanden hierin uit
Wij hebben dit reeds op de usb-stick staan:
map joomla 2.5.4
Benodigdheden

17. FTP-cliënt
Kopieert je bestanden van je harde schijf naar
je webruimte
http://filezilla-project.org/download.php
(=gratis)
Kopieer je installatiebestanden van je harde
schijf naar je webruimte. Dit kan vrij lang
duren.
Filmpje
Benodigdheden

18. Afhankelijk van aangevraagde webruimte:
database met MySQL aanmaken
000.webhost.com
Voorbeeld Webreus
Installatie van Joomla

19. Alle gebruikers eigen database en
subdomein:
Gebruiker 1: http://joomla01.classy.be
Gebruiker 2: http://joomla02.classy.be
Alle gebruikers dezelfde database en
hetzelfde subdomein
Wij kiezen dit laatste:
Ik heb 2 databases en 2 subdomeinen
aangemaakt
Twee installatieopties

20. http://ictdag1.baso.khlim.be/familienaam
Gebruikersnaam: ictdag1
Database: ictdag1
wachtwoord: gent123
Geavanceerde instellingen
(voorvoegsel uniek maken)
Eén database en één
subdomein

21. Filezilla openen
Host = baso.khlim.be
Gebruikersnaam = ictdag1
Wachtwoord = gent123
Snelverbinden
Open rechts httpdocs
Maak een nieuwe map aan (familienaam)
Kopieer je installatiebestanden van links
naar je eigen map rechts
Eén database en één
subdomein

22. http://ictdag2.baso.khlim.be/familienaam
Gebruikersnaam: ictdag2
Database: ictdag2
wachtwoord: gent123
Geavanceerde instellingen (voorvoegsel
uniek maken)
Eén database en één
subdomein

23. Filezilla openen
Host = baso.khlim.be
Gebruikersnaam = ictdag2
Wachtwoord = gent123
Snelverbinden
Open rechts httpdocs
Maak een nieuwe map aan (familienaam)
Kopieer je installatiebestanden van links
naar je eigen map rechts
Eén database en één
subdomein

24. Frontend
Dit is wat de gebruiker te zien krijgt: de
website
Surf naar: http://joomlaxx.classy.be
Backend
Beheerder van de website
Wijzigingen aanbrengen aan de frontend
Surf naar
http://joomlaxx.classy.be/administrator
Login: admin
Paswoord: joomla
Joomla configureren

25. Backend
Starten met de Backend
Controlepaneel
Ga naar Frontend

26. Gebruikersbeheer
Extra gebruikers toevoegen met rechten om
website eventueel aan te passen met eigen
naam en paswoord
Algemene instellingen
Tip: Tabblad Systeem: Sessie levensduur
verhogen
Tabblad Website

27. Webpagina’s maak je altijd in een
ARTIKEL (inhoud)
Structuur 1.5:
Opbouw Joomla 2.5
SECTIE
CATEGORIEEN
ARTIKELEN die je dan kan koppelen aan
een MENU

28. Opbouw Joomla 1.6-1.7-…
Subcategorieën
Subsubcategorieën
ARTIKELEN die je dan kan koppelen aan
een MENU
Categorieën

29. STRUCTUUR
Website
Categorie Categorie
SubCategorie SubCategorie SubCategorie SubCategorie
Artikel/pagina
Artikel/pagina
Artikel/paginaArtikel/pagina
Artikel/pagina
Artikel/pagina
Voorpagina

30. Meerdere categorieën
Voorbeeld: site van een krant
Je kan een categorie beveiligen, waardoor de
artikelen die hierin staan enkel door
leden/klanten bezocht kunnen worden. Bv. je
beveiligt de sectie buitenlands voor je leden.
Je kan achter één menu-item meerdere
artikelen (uit één categorie) tonen in
lijstweergave of volledig (blogweergave).
Vanaf 1.7 kan dit ook via Speciale Aritikelen (zie
later)

31. Voorbeeld: nut van
Categorieën
Joomla 2.5
Speciale Artikelen: je kan zo artikelen over verschillende categorieën
verspreid toch op één pagina (artikel) krijgen

32. Artikel aanmaken dat op voorpagina zal
verschijnen: “Welkom op mijn website
over NY” (http://www.lipsum.com)
Artikelenbeheer
Tweede artikel aanmaken dat via menu
bereikbaar zal worden.
Categorieën en subcategorieën
aanmaken
Waarom?
http://leerplankv.baso.khlim.be/projectburotica
Filmpje
Opbouw Joomla

33. Districten
Algemeen
Bezienswaardighed
en
Categorieën

35. Artikelenbeheer
Speciale artikelen
kom in het
algemeen op de
startpagina
Om goed overzicht
te bewaren kan je
categorie waarin je
werkt selecteren.
Bij ieder artikel kan
je toegangsniveau
instellen. Wie mag
dit artikel bekijken?
(Login venster =
geregistreerd)

36. Parameterinstellingen

37. Parameterinstellingen

38. Tip:
In Artikelenbeheer heb je een kop Opties:
De parameterinstellingen die je hier maakt
gelden voor alle artikelen

39. Artikelen kunnen alleen bereikt worden via
menu
Artikel “Central Park” toegankelijk maken
Via Menubeheer
Belangrijk: eerst artikelen aanmaken
Filmpje
Menubeheer

41. Begrip Modules
Alles wat geen inhoud krijgt is een module
Een module plaats je op een bepaalde positie
van je website
Welke posities zijn er in je website?
Extensies- Templatebeheer
Opties
Posities kan je bekijken via Frontend door na
de URL “index.php?tp=1” te typen.
Een eigen menu ontwerpen

42. Posities

43. Artikelen verschijnen
standaard op een vaste
plaats (centraal). Via deze
module kan je bijvoorbeeld
tekst op een gewenste
positie plaatsen
www.murimpreg.be (premie)

44. Filmpje
Maak een menu aan via Menubeheer
(bovenmenu)
Verplaats Home – Bezienswaardigheden
van Mainmenu naar Bovenmenu
Maak het menu-item Districten
Menu-items Uptown en Downtown onder
Districten
Klik op voorbeeld. Krijg je dit menu te
zien?
Een eigen menu ontwerpen

45. Je moet inderdaad nog de module Menu
aanmaken via Extensies-modulebeheer
en het menu hier aan koppelen
Een eigen menu ontwerpen

46. Maak een nieuw Menu aan: Submenu1
Maak twee menu-items aan: Brooklyn en
Soho
Maak een module aan Menu: Downtown
Geef een positie (position-07)
Ik wil dit submenu enkel zien wanneer ik
op Districten-Downtown klik: Hoe doe ik
dit?
Maak nu Uptown aan!
Een submenu ontwerpen

48. Wij willen artikelen die verdeeld zijn over
verschillende categorieën toch in 1 pagina
laten verschijnen
We maken twee categorieën bij: Acties en
Nieuwtjes
In Acties: artikel “Bloomingdales” (Speciaal)
In Nieuwtjes: artikel “Wist je dat ?” (Speciaal)
Maak een nieuw menu-item
“Interessante info”
Nieuwtjes

49. Hoofdartikelen: over de gehele breedte
Intro-artikelen: staan in kolommen
#links: artikelen zullen via een link beschikbaar gemaakt
worden
indien nodig
Voorbeeld: ik heb 7 artikelen in totaal op één pagina
0 (hoofd) + 4 (intro) = 4 artikelen
Er zijn dus nog 3 artikelen over (7 – 4) die via links
beschikbaar worden

50. Algemene wijzigingen
Kies Extensies-Templatebeheer
Je krijgt een aantal templates te zien: Beez20 is
standaard voor WEBSITE en Bluestork voor
ADMINISTRATIEPANEEL
Klik op de templatenaam
Je kan nu een aantal wijzigingen doorvoeren,
zoals het logo wijzigen
Templates

51. CSS wijzigen
CSS is de opmaak van je website, niet de inhoud
Via Filezilla CSS-bestand downloaden en
bewerken
Terug uploaden (zie html)
HTML wijzigen
In de voet (footer) staat er Powerd by Joomla
Download index.php vanuit de map
templates/beez20
Tip: a href staat voor een hyperlink (Joomla), php echo
staat voor typ
Opgepast: Zie dat je de originele html nog ergens
bewaart om evt. terug te zetten indien niet gewenst
resultaat.
Templates

52. Kiezen voor een andere template
Kies een template uit de lijst
Download een template naar keuze via Extensies-
Installeer (opgelet: zorg dat de template geschikt is
voor 1.7)
http://www.web-garden.be/templates/
http://www.siteground.com/joomla-hosting/joomla-templates.ht
http://www.joomla24.com/
Templates

53. Figuren wijzigen
Zoek de originele afbeeldingen op je webruimte
(Filezilla): templates/beez20/images
Wijzig de afbeelding met
beeldbewerkingsprogramma (Fireworks, Gimp,
Photoshop)
Alternatief: nieuwe afbeelding maar originele
afbeelding overschrijven (benaming is zeer
belangrijk)
Templates

54. Ontwerp zelf een sjabloon en installeer dit
Moeilijk?
Ja en Neen?
Ja: Deel 3 Joomla met relatieve div’s werken (vanaf nul
opbouwen)
Neen: Aristeer 3.0 (nodig voor Joomla -1.6 of 1.7)
Filmpje
Templates

55. Aristeer 3.0
Na installatie
Templates

56. Sla dit sjabloon op als NewYork.artx (alleen
maar als je een licentie hebt)
Exporteer dit sjabloon als NewYork.zip naar je
lokale schijf
Installeer het sjabloon via Extensies-
Extensiebeheer
Maak NewYork je standaardsjabloon
En nu?
Posities aanpassen in Modules
“Submenu-items tonen” aanvinken (JA)
Opmaak van verticaal menu toepassen op
submenu
Templates

58. Module Login
Filmpje (login)
Gebruikersbeheer
Nieuwe gebruiker aanmaken Frontend (login)
Nieuwe gebruiker aanmaken Backend (via
http://www.joomlaxx.classy.be/administrator)
Rechten toekennen aan gebruikers
http://www.zelfstudie.be/cursussen/joomla.php?id=34
Berichten sturen - groepsmail
Login (gebruikers)

59. Je kan je website voorzien van externe
links
Filmpje
Nieuwe categorie maken die links gaat
verzamelen (opgepast: geen gewone
categorie)
Componenten-Weblinks-Categorieën
Nieuwe link toevoegen
Componenten-Weblinks-Links
Weblinks toevoegen aan menu
Gebruiker Weblinks laten toevoegen: hoe?
Weblinks

60. Breadcrumbs of broodkruimels volgen het
pad dat je volgt op een website
(hyperlinks)
Toevoegen via Modulebeheer (kruimelpad)
Plaats is gereserveerd (breadcrumbs)
Tip: Home niet tonen !!!
Broodkruimels

61. Wie is er online?
Geeft het aantal bezoekers op een bepaald
ogenblik aan
Banners
Acties aankondigen
Reclame maken
Meest gelezen (welke artikelen?)
Andere zinvolle modules

62. Joomla breid je uit aan de hand van extensies
Er bestaan enorm vele en zinvolle
uitbreidingen: Joomla!extensies op
http://www.dutchjoomla.org
OF http://extensions.joomla.org
Niet iedere extensie is geschikt voor iedere
versie:
1.0 Native (werkt alleen bij Joomla 1.0.x)
1.5 Legacy (is geschreven voor Joomla 1.0.x maar
werkt in Legacy Mode ook voor 1.5.x
Via Pluginbeheer
Joomla uitbreiden

63. Plugins
Gebruik: in een artikel
Moet meestal nog geactiveerd worden na
installatie
Toepassing: Filmpje van New York integreren in
een artikel.
AllVideos (link)
Module
Op een bepaalde positie in je website
Module Weer (link)
Welke uitbreidingen?

64. Component
Gebruik: meestal koppelen aan menu-item
Foto album 0zioGallery (link)
Uitzonderingen:
JCE-editor (link)
Zo kan je je opmaakmogelijkheden in een artikel
uitbreiden (tabel, links naar andere artikelen (cfr
wikipedia), …)
Backup van je website Akeeba (link)
Welke uitbreidingen?

65. Nut?
Server crasht
Een foute component geïnstalleerd waardoor
website niet meer werkt
Een nieuwe domeinruimte voor website met
nieuwe database-gebruiker-…
Backup

66. Ga naar configuratie en zorg dat backup als
zip ipv jpa gemaakt wordt
Dowload het zip-bestand (Administer backup
files) en bewaar het op USB-stick
Pak het zip-bestand uit en upload het naar je
domeinruimte (zoals installatiebestanden)
Akeeba

67. Ik was op zoek naar een manier om een
gallerij van afbeeldingen te plaatsen in een
artikel
Vaak vind je dit toevallig!
Op extensie gezocht naar AllVideos om video’s te
implementeren
Surf naar http://www.joomlaworks.gr
Hoe vind je een extensie?

68. Fotoalbum

69. Download Plugin
Kies Extensies-Installeer
Blader naar het zip-bestand en klik op Upload
bestand & installeer
Fotoalbum

70. Na installatie krijg je volgende gebruiksuitleg:
M.a.w. kopieer je afbeeldingen (Filezilla) naar de
map images/stories/parijs (bijvoorbeeld)
Typ in je artikel op de plaats waar je de
afbeeldingen wil invoegen {gallery}parijs{/gallery}
en klaar is kees?
Fout: je moet plugin nog activeren via Extensies-
Plugin
Fotoalbum