Joomla 3.0

695 views
587 views

Published on

Joomla cursus versie 3.x

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
695
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
8
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Joomla 3.0

  1. 1. ICT-dag13 mei HasseltBruno ParthoensDocent LerarenopleidingKatholieke Hogeschool Limburgbruno.parthoens@khlim.be
  2. 2. Joomlavoor beginners
  3. 3. Joomlaxx.classy.be
  4. 4. Versie 2.5 is een long-time release net alsde 1.5 (minstens 18 maanden)Ondertussen is joomla 3.0 uit maar istestversie en geen long-time release (3.5wel)Wij gaan werken met de 3.0 omdat layoutwezenlijk verschillend is tov 2.5 maarprincipes blijven hetzelfdeJoomla 2.5
  5. 5. http://www.zelfstudie.be (registratie??)http://www.zelfstudie.be/registratie-ict-joomla.php http://www.gratiscursus.bePresentatieSlideshare….Cursusmateriaal
  6. 6. CMS (Content Managment System):website die volledige klaar is enaanpasbaarAnder bekend voorbeeld: DRUPALPHP en MySQL maar geen kennis nodigVolledig gratisWat is Joomla?
  7. 7. WebruimteJoomla installatiebestandenFTP-cliëntBenodigdheden
  8. 8. Offline werken: Je ontwerpt je websitelokaal en publiceert achteraf de bestandennaar webruimteHarde schijf (Wampserver nodig op je PCvermits Joomla ontwikkeld is met PHP en eenMySQL-database)http://www.wampserver.comAlle bestanden worden aangemaakt engeïnstalleerd in de map c:wampwwwjoomlahttp://www.zelfstudie.be (Joomla 1)Mogelijkheden
  9. 9. USB-stick (USBwebserver nodig)http://www.usbwebserver.comJe maakt je volledige website alzo op je USB-stickof externe harde schijfOnline werken: Je ontwerpt je volledigewebsite rechtstreeks op de webserverMogelijkheden
  10. 10. WebruimtePHP ondersteunenMySQL-database aanbiedenInstellingen op de php-databaseondersteunenVoorbeelden:One.comWebreus.nlhttp://www.1freehosting.com/000webhost.com (volledig gratis met cPanel omdatabases, subdomeinen,… aan te maken)Benodigdheden
  11. 11. Joomla installatiebestandenhttp://www.joomladownloads.nl/downloadsMaak een mapje Joomla aan op je hardeschijf en pak de bestanden hierin uitBenodigdheden
  12. 12. FTP-cliëntKopieert je bestanden van je harde schijf naarje webruimtehttp://filezilla-project.org/download.php(=gratis)Kopieer je installatiebestanden van je hardeschijf naar je webruimte. Dit kan vrij langduren.Benodigdheden
  13. 13. Afhankelijk van aangevraagde webruimte:database met MySQL aanmaken000.webhost.comInstallatie van Joomla
  14. 14. Alle gebruikers eigen database ensubdomein:Gebruiker 1: http://joomla01.classy.beGebruiker 2: http://joomla02.classy.beAlle gebruikers dezelfde database enhetzelfde subdomeinTwee installatieopties
  15. 15. FrontendDit is wat de gebruiker te zien krijgt: dewebsiteSurf naar: http://joomlaxx.classy.beBackendBeheerder van de websiteWijzigingen aanbrengen aan de frontendSurf naarhttp://joomlaxx.classy.be/administratorLogin: adminPaswoord: joomlaJoomla configureren
  16. 16. Starten met de BackendGa naar Frontend
  17. 17. WebsiteOffline plaatsenTeksteditorSysteemAlgemene Instellingen
  18. 18. Webpagina’s maak je altijd in eenARTIKEL (inhoud)Opbouw Joomla 2.5SubcategorieënARTIKELEN die je dan kan koppelen aaneen MENU of tonen op Startpagina (Home)Categorieën
  19. 19. Duidelijke structuur (bestandsbeheerWindows)Bepaalde artikelen zijn niet voor iedereenbestemdArtikel per artikel beveiligen of die artikelen ineen categorie stoppen en de categoriebeveiligenJe kan een categorie koppelen aan MenuZo kan je meerdere artikelen op één paginatonenNut van categorieën
  20. 20. ofMaak 4 categorieën aan:DistrictenStartpaginaBezienswaardighedenAlgemeenCategorieën
  21. 21. 2 artikelen aanmaken die op voorpaginazullen verschijnen: “Dag1” en “Dag 2”(http://www.lipsum.com)ArtikelenbeheerofOpbouw Joomla
  22. 22. Artikel “Getting Started” verwijderen(prullenbak)Bekijk de websiteArtikelenbeheer
  23. 23. In het menu “Main Menu”Menu-item (knop) HomeKlik op HomeType wijzigenIk wil enkel de artikelen tonen op de homepaginadie in de categorie Startpagina staanHome aanpassen (menu-item)
  24. 24. Artikel “Dag 1”Startpagina
  25. 25. Artikel “Dag 2”Startpagina
  26. 26. Startpagina• Hoe worden meerdere artikelen op éénpagina getoond?
  27. 27. Artikelen kunnen alleen bereikt worden viamenuBelangrijk: eerst artikelen aanmakenMenubeheer
  28. 28. Artikelen aanmakenSpeciale artikelen (alle artikelen diespeciaal zijn en in de categorie “Startpagina” staanworden op de home-pagina getoond
  29. 29. Artikelen kunnen alleen bereikt worden viamenuMenu’s-Main MenuNu kan je menu-items toevoegenMenubeheer
  30. 30. Maak het menu-item“Bezienswaardigheden”Menu-items maken
  31. 31. Maak het menu-item“Bezienswaardigheden”Waarom leeg?Bezienswaardigheden bevat zelf geen inhoudmaar opent een submenuMenu-items maken
  32. 32. Maak het menu-item “Empire StateBuilding”Het bovenliggend menu-item isMenu-items maken
  33. 33. Menu-items
  34. 34. Maak het menu-item “Districten” en alssubmenu-items “Uptown” en “Downtown”Koppel ze alle drie aan het artikel “Leeg”Door te klikken op Uptown opent zich eennieuw MENU aan de linkerzijdeDoor te klikken op Downtown opent zicheen nieuw MENU aan de linkerzijdeMenu-items en Menu’s
  35. 35. Begrip ModulesAlles wat geen inhoud krijgt is een moduleEen module plaats je op een bepaalde positievan je websiteWelke posities zijn er in je website?Extensies- TemplatebeheerOptiesPosities kan je bekijken via Frontend door nade URL “index.php?tp=1” te typen.Een eigen menu ontwerpen
  36. 36. Posities
  37. 37. Linkse positie - position-8Stap 1: Nieuw Menu makenMenu-item “Bronx” maken in menu “Uptown”Module
  38. 38. Stap 2: nieuwe module maken om menu‘Uptown” een positie te kunnen gevenExtensies-ModulebeheerKies NieuwModule
  39. 39. Stap 3: Module ‘‘Uptown” koppelen aanmenu “Uptown”GegevensBasis-optiesModule Menu
  40. 40. Bekijk je website: Wat stel je vast?Uptown wordt altijd getoondHoe oplossen?Extensies – Modulebeheer – UptownModule is toegewezen op alle pagina’sModule Menu
  41. 41. Kies “Alleen op de geselecteerde pagina’sModule Menu
  42. 42. Maak DowntownDoor te klikken op menu-item “Downtown” inhet hoofdmenu komt er een nieuw Menu“Downtown” tevoorschijn aan de linkerkantmet menu-items “Soho” en “Brooklyn”Opdracht
  43. 43. Voorbeeld: BronxVoorbeeld: Dag 1Hoe worden artikelengetoond?
  44. 44. Voorbeeld: Toon titelArtikel BronxArtikel optiesGebruik AlgemeenWaaren hoe instellen?
  45. 45. Voorbeeld: Toon titelOpen ArtikelbeheerKies OptiesDeze instellingen gelden voor alle artikelen(algemene instellingen)Waaren hoe instellen?
  46. 46. Titel staat op “Tonen”Gebruik Algemeen = TonenWaaren hoe instellen?
  47. 47. Algemene instellingen (Opties)Afwijken door individueel het artikel in testellenMaar instellingen bij menu-item heeftALTIJD voorrangOpen Menu-itemKies: Geavanceerde optiesKies Artikel optiesVolgorde
  48. 48. Artikel Bronx: Toon titelAlgemene opties: Verberg titelResultaat: Toon titelMenu-item Bronx :Artikeloptie: Gebruik algemeenResultaat: Verberg titelVoorbeeld
  49. 49. Dia 31Eerste artikel over ganse pagina verdeeldVanaf tweede artikel in 2 kolommenAlgemene opties (artikelbeheer)Idemblogweergave (specialeartikelen)
  50. 50. Hoe afwijken?Menu-item aanpassenVoorbeeld HomeBlogweergave
  51. 51. Algemene wijzigingenKies Extensies-TemplatebeheerJe krijgt een aantal templates te zien: Protostar isstandaard voor WEBSITE en Isis voorADMINISTRATIEPANEELKlik op de templatenaamVia opties kan je een aantal wijzigingendoorvoerenTemplates
  52. 52. Templates
  53. 53. Kiezen voor een andere templateKies een template uit de lijstDownload een template (opgelet: zorg dat detemplate geschikt is voor Joomla 3.x)http://www.web-garden.be/templates/https://www.siteground.com/joomla-templates.htmhttp://www.joomla24.com/Templates
  54. 54. Aristeer 3.0Na installatieTemplates
  55. 55. Je krijgt een mail gestuurd met dedownloadlinkTemplates
  56. 56. Templates
  57. 57. Extensie-ExtensiebeheerBlader naar het gedownloade bestandKlik op Uploaden& InstallerenTemplate installeren
  58. 58. Extensies-templatebeheerStandaard instellenBekijk website: wat is er gebeurd?Template installeren
  59. 59. Nieuwe template – Andere positiesAlle modules terug een positie toekennenVoorbeeldweergave = inschakelenIndex.php?tp=1 om de posities zichtbaar te makenTemplate
  60. 60. Nieuwe banner (header)Titel in banner verwijderenUiterlijktemplate wijzigen
  61. 61. Achtergrond verwijderenUiterlijktemplate wijzigen
  62. 62. Voetnoot wijzigen (footer)Uiterlijktemplate wijzigen
  63. 63. Kies Componenten-extplorerAlternatief: filezilla ofOpen ALTIJD de map Templates envervolgens Sitegroundj16-47Belangrijke mappen/bestanden:Map ImagesMap CSS (opmaak)Index.phpTemplates.phpExtplorer(bestandsbeheer)
  64. 64. Map ImagesHeader.png (Bekijk )Altijd bestand hernoemen vooraleer te wijzigen(header1.png): RMK – hernoemenDownload het bestandAfbeeldingen template
  65. 65. Open het bestand header1.png metbijvoorbeeld PaintKies Formaat wijzigenKlik op pixelsMaak een nieuwe headervan 960x280 pxKies een afbeelding vaninternet, open deze in Paint, Fireworks,Photoshop,Gimp,…Bewerk de foto (juiste grootte, tekst)Sla op als header.pngAfbeeldingen template
  66. 66. Ga naar ExtplorerUpload het bestand naar de map ImagesBekijk je websiteAfbeeldingen template
  67. 67. Uw Joomlaomgeving = naam van websiteJe kan titel wijzigen maar niet leeg latenHet is geen afbeelding, dus niet in de mapimagesBlijft over index.phpHoofding aanpassen
  68. 68. Veilige procedure:Hernoem index.php naar index1.phpDownload index1.phpBewerk index1.php en sla op als index.phpUploadGevaarlijke procedure:RMK index.php – BewerkenZoek naar headerVerwijder alles tussen <header>…</header>Hoofding aanpassen
  69. 69. Open map images – bekijk bckgr.pngAchtergronden worden meestal aangesprokenin de css (opmaak)Open de map CSS en bekijk template.cssAchtergrond wijzigen
  70. 70. Verschillende mogelijkheden:Eigen achtergrondafbeelding maken (zoalsheader) en opslaan als bckrg.pngAndere naam geven maar dan moet je dit ookveranderen in de cssAchtergrondafbeelding gewoon verwijderen. CSSverwijst wel naar die afbeelding maar als deze nietgevonden wordt, wordt er niets getoond.Verwijder bckgr.pngBekijk websiteAchtergrond wijzigen
  71. 71. Wijzig het opsommingstekenOefening
  72. 72. Opbouw bestuderen:SitenameTekst: Powered byHyperlink tekst JoomlaHyperlink tekst Hosting for Joomla by SitegroundMeestal in index.phpZoek naar footer en daar vind je dan de volledigeinhoud van voettekstHier vinden we daar niets over in index.phpOpen templates.phpVoetnoot wijzigen
  73. 73. Eerste regel verwijst naar sitename – poweredby – link op Joomla (ahref)Verwijder de volledige regelVerwijder de a href in laatste regelVervang Hosting for Joomla… door gemaaktdoor BrunoVoetnoot wijzigen
  74. 74. Joomla breid je uit aan de hand van extensiesEr bestaan enorm vele en zinvolleuitbreidingen: http://extensions.joomla.orgNiet iedere extensie is geschikt vooriedereversieJoomla 3 is pas uit, dus heel veel extensieswerken nog niet voor deze versieJoomla uitbreiden
  75. 75. PluginsGebruik: in een artikelMoet meestal nog geactiveerd worden nainstallatieToepassing: Filmpje van New York integreren ineen artikel.AllVideosModuleOp een bepaalde positie in je websiteModule WeerAangepaste HTML ( zo kan je tekst op een bepaaldepositie laten zien)Toepassing VLIEGTICKETS (enkel op Home)Welke uitbreidingen?
  76. 76. ComponentGebruik: meestal koppelen aan menu-itemFoto album EventGalleryUitzonderingen:JCE-editorZo kan je je opmaakmogelijkheden in een artikeluitbreiden (tabel, links naar andere artikelen (cfrwikipedia), …)Backup van je website AkeebaWelke uitbreidingen?
  77. 77. Extensies – ExtensiebeheerUpload de component jceGa naar Algemene instellingen en selecteerJCEJCE-editorinstalleren?
  78. 78. Open Artikel Dag 2:Oplossing:Open Component JCEJCE-editorinstalleren?
  79. 79. Open Artikel Dag 2Selecteer tekst “Central Park”Insert LinkOpen Content…Links leggen in artikel naaranderartikel
  80. 80. Installeer Component Event GalleryOpen de component na installatieMaak een event (fotoboek) aanLaad foto’s opFoto-album
  81. 81. Installeer de plugin AllVideosMaak een artikel YoutubeKoppel een menu-item Video aan dit artikelOpen het artikelPlugin werkt altijd op dezelfde manier:{code} tekst {/code}Hier: {youtube} ID {/youtube}ID haal je uit filmpje van youtube door te delen:c2QEYvidqW8Plugin
  82. 82. Nut?Server crashtEen foute component geïnstalleerd waardoorwebsite niet meer werktEen nieuwe domeinruimte voor website metnieuwe database-gebruiker-…Backup
  83. 83. Vanaf versie 3 reeds voorzienGa naar configuratie en zorg dat backup alszip ipv jpa gemaakt wordtMaak BackupDowload het zip-bestand (Administer backupfiles) en bewaar het op USB-stickPak het zip-bestand uit en upload het naar jedomeinruimte (zoals installatiebestanden)Akeeba

×