Instructie Joomla! 2.5 - onderhoud website d.d. 16 november 2013 (geel = nieuw) Inloggen via de voorkant Voor het eenvoudig aanpassen van teksten. Of: klik binnen je website op de link Inlog of Login, waarmee je terecht komt op het inlogscherm van het CMS. Of: probeer www.domeinnaam.nl/inlog of www.domeinnaam.nl/login Log in met de Gebruikersnaam en Wachtwoord die je in een aparte mail hebt ontvangen. Je ziet nu dat er onder- of bovenaan iedere pagina waar je toegang toe hebt een Bewerk artikel (papier met potlood) is verschenen. Ga via het menu naar de pagina die je wilt wijzigen en klik op dit icoon. Je komt nu in de Tekstverwerker en kunt de pagina wijzigen. Werking JCE Tekstverwerker Als je met de muis over een button gaat, krijg je vanzelf de naam van de bijbehorende functie te zien. De belangrijkste zijn: Kies na het kopiëren voor het plakken van tekst altijd: Plak als platte tekst = zonder opmaak!!! TIP: gebruik altijd de button [Koffer-T] als je tekst vanuit een andere toepassing kopieert en wilt plakken, zodat de oude opmaak niet mee gekopieerd wordt. Je kunt de tekst daarna verder opmaken m.b.v. de aanwezige beschikbare buttons in de Tekstverwerker. Plakken: Niet gebruiken als je tekst vanuit Word of e-mail kopieert en plakt => neem dan altijd de button [Koffer-T]. Wel te gebruiken als je tekst vanuit een ander artikel vanaf dezelfde website kopieert en plakt. Ongedaan maken (Ctrl+Z). Invoegen/wijzigen link: voor het invoegen of wijzigen van een hyperlink: Selecteer de tekst waarin de hyperlink moet komen. blad 1 van 14
URL: Of: plak hierin de gewenste hyperlink, bv. http://www.website.nl Of: klik op +Menu, selecteer het betreffende Menu en het betreffende menu-item waarnaar je wilt linken [Invoegen]. Of: Klik op het icoon Bladeren (zie rode cirkel) en leg een link naar een bestand (bv. pdf). Deze kun je in dit Browserscherm eventueel ook eerst uploaden (zorg dat je alles netjes in mappen verdeeld houd). Doel: o Openen in huidig scherm / frame: als het een link is binnen deze website. o Openen in nieuw venster: ALTIJD als het een link is naar een andere website of naar een pdf-bestand (belangrijk!). [Invoegen]. Invoegen/wijzigen afbeelding: voor het uploaden, invoegen of wijzigen van afbeeldingen (zie elders in deze instructie). Opsommingstekens: voor het gebruik van opsommingstekens. TIP Gebruik deze manier en nooit het streepje - Paragraaf: maak gebruik van voorgedefinieerde opmaakprofielen. De titel van een pagina heeft meestal een opmaakprofiel, bv. Kop 1 of Kop 2 (zie uitklapmenu van Opmaak). De rest van de pagina is meestal Paragraaf (gewone tekst), in combinatie met vet of cursief. Hierin zit de opmaak (lettertype en grootte) voor gedefinieerd m.b.v. een stylesheet. TIP kijk eerst hoe een bestaande tekst of titel is opgebouwd en neem dit over. Invoegen lees meer: deze kun je gebruiken bij een weblog, om te zorgen dat je pagina s niet te lang worden. Bezoekers krijgen op de plek waar je dit neerzet een `Lees meer` link te zien. blad 2 van 14
Invoegen/wijzigen anker: je kunt een anker invoegen midden in een tekst en daar een hyperlink naartoe maken. Visuele controletekens aan/uit: hoe zit mijn opmaak in elkaar? Waar zitten de alinea s? Zet deze knop dan even aan en je ziet wat meer onder water. Opmaak verwijderen en Opschonen code: selecteer de tekst met opmaak die je wilt wissen en klik hierop. Schakelen broncode: schakelen naar html-code. Zelf gebruik ik deze button het meest. Als er iets geks of onverklaarbaars getoond wordt op de website kun je hiermee goed zien wat dat dan is. Het werken met de tekstverwerker Het lijkt erg op Word: vet, cursief, knippen, plakken, tabel invoegen (ingewikkeld). Let op: als je tekst kopieert en plakt vanuit een andere toepassing (Word, Outlook enz.) dan moet je ALTIJD plakken m.b.v. Koffer-T = Plak als platte tekst gebruiken (zie afbeelding). Als het lettertype na het plakken van tekst er anders uitziet moet je meteen(!) bedenken dat je de tekst verkeerd hebt geplakt (met opmaak)! Kies in dat geval voor: Ongedaan maken en plak dezelfde tekst opnieuw met [Koffer-T] = [Plak als platte tekst] gebruiken, dus zonder opmaak. Als je de opmaak niet goed krijgt kun je beter (even snel) alle tekst knippen, daarna weer plakken met [Koffer-T] en de tekst opnieuw opmaken. Of de tekst selecteren en klikken op: [Opmaak verwijderen]. Maak zoveel mogelijk gebruik van opsommingtekens, want dat staat netjes. Met [enter] ga je 2 regels naar beneden = nieuwe alinea. Met [shift-enter] ga je 1 regel naar beneden = je blijft in dezelfde alinea(opmaak). Plaats het euroteken gevolgd door een vaste spatie = Shift-Ctrl-Spatie, de tekst wordt dan aan het einde van een zin niet direct na het euroteken afgebroken. Zodra een pagina langer wordt verschijnt er vanzelf een schuifbalk. De opmaak staat al standaard ingesteld wat betreft lettertype, grootte en kleur, dus geef aan de tekst nooit een eigen opmaak mee, maar kies uit de voor definieerde opmaakprofielen: De koppen krijgen allemaal dezelfde opmaak (bv. kop 2) mee. Kijk dit af van een bestaande pagina. Doe dit als volgt: o Selecteer de kop en klik dan op: Opmaak > Kop 2 (zie afbeelding). Pas na het opslaan zie je aan de voorkant van de website hoe het er in het echt uitziet. Controleer dit ALTIJD! blad 3 van 14
Bewerking opslaan of annuleren Opslaan Annuleer Als je zeker weet dat de bewerking van de tekst goed ging kun je deze opslaan. Als je NIET zeker weet dat de bewerking goed ging kun je beter de wijzigingen annuleren en het opnieuw proberen! Als je een pagina hebt gewijzigd moet je deze ALTIJD controleren in je browser zoals de bezoeker de pagina ziet. Eventueel: ga naar Inlog, kies [Log-uit] en controleer nogmaals de gewijzigde pagina. Niet te wijzigen via de voorkant: Teksten of afbeeldingen die je niet via de voorkant kunt aanpassen zitten meestal in: Modules: ga voor het bewerken hiervan naar Inloggen via de achterkant. Template: neem dan contact op met: info@4yourwebdesign.nl. Inloggen via de achterkant Voor het toevoegen of verwijderen van menukeuzes, aanmaken van nieuwe pagina s of het wijzigen van teksten in Modules die niet via de voorkant te bewerken zijn. Dit is wat ingewikkelder. Je kunt hiervoor het beste eerst een instructie op de werkplek aanvragen bij: info@4yourwebdesign.nl Instructie Ga naar: http://www.naamwebsite.nl/administrator Log in met de apart verkregen inlognaam en wachtwoord. Je bent nu in de achterkant van je website = het CMS. blad 4 van 14
Uitleg Teksten of foto s die niet via de voorkant aan te passen zijn kun je wel via de achterkant wijzigen. Ga dan naar het hoofdstuk over Modules. Als je nieuwe pagina s wilt aanmaken ga dan eerst naar het hoofdstuk over Artikelen (voeg deze artikelen daarna toe aan een menu). Als je menukeuzes wilt aanmaken - maak dan eerst een nieuw artikel aan - of (tijdelijk) wilt uitzetten/verwijderen, ga dan naar het hoofdstuk over Menu s. Modules Ga naar: Extensies > Modulebeheer. Het is altijd even zoeken welke module je moet hebben. o TIP: Gebruik het filter of selecteer bv. bij [Selecteer status]: Gepubliceerd, of selecteer een bepaald positie of type. Modules - wijzigen van Tekst - Module Aangepaste HTML Klik op de blauwe link van de module die je wilt wijzigen. Modulebeheer Gegevens Titel: naam van de module. Toon titel: Toon = wordt getoond, Verberg = wordt niet getoond. Positie: geeft de plek aan in de website waar deze module getoond wordt. blad 5 van 14
Status: Gepubliceerd: hiermee kun je een module (tijdelijk) uitzetten (Gedepubliceerd) of weer aanzetten. Toegang: in te stellen indien van toepassing (bij het werken met autorisaties). Volgorde: geeft de volgorde aan binnen de positie waarin deze module getoond wordt. Start + Stop publiceren: vul een gewenste datum in of niets. Taal: bij meertalige websites in te stellen bij welke taal de module getoond moet worden. Aangepaste uitvoer Hier zie je de tekst staan die deze module bevat. Pas dit aan, indien gewenst. Zie Werking JCE Tekstverwerker elders in deze instructie. Menutoewijzing Stel in waar de module getoond - of juist niet - moet worden. Rechts bovenaan zie je: [Opslaan] = sla de wijzigingen op en blijf in deze module (check bv. eerst het resultaat van de wijziging aan de voorkant van de website in een ander venster). [Opslaan & Sluiten] = sla de wijzigingen op en sluit de module. [Opslaan & Nieuw] = Sla de wijzigingen op en open een nieuwe module. [Opslaan als kopie] = Sla de wijzigingen op in een kopie. [Sluiten] = sluit de module zonder deze te wijzigen. Gebruik dit altijd als je niet zeker weet of je de wijziging goed hebt uitgevoerd! TIPS: Controleer altijd direct in je browser hoe de wijziging is geworden en pas deze indien nodig weer aan! Het blijft een kwestie van uitproberen wat de verschillende instellingen tot gevolg hebben. Invoegen van een afbeelding m.b.v. de JCE tekstverwerker Open het Artikel of Module waar de afbeelding in geplaatst moet worden. Ga in de tekst staan waar de foto moet komen en klik op het icoon [Invoegen/wijzigen afbeelding]: Je komt nu in Afbeeldingsbeheer, waar je in de linker kolom de -Root ziet staan met reeds beschikbare afbeeldingen voor de website. blad 6 van 14
Selecteer in de linker kolom, indien nodig, de map en in de middelste kolom de betreffende foto. o Denk ook aan (zie afbeelding): Uitlijning links of rechts; Marge (ruimte) om de foto heen; rand om de foto; Pas hier NOOIT de Afmetingen aan, maar doe dat m.b.v. Photoshop o.i.d. en upload de foto opnieuw (zie instructie verderop). Kies [Invoegen]. De pagina is nu gewijzigd met de nieuwe foto. Wijzigen afbeelding: Als je niet tevreden bent klik je opnieuw op de foto (grijpkaders worden zichtbaar) en op het icoon [Invoegen/wijzigen afbeelding]. Uploaden van een nieuwe afbeelding naar de website Zorg eerst dat de afbeelding het juiste formaat heeft => zie het hoofdstuk over Foto s bewerken. Ga op de plek staan waar de afbeelding moet komen. Klik op het icoon [Invoegen/wijzigen afbeelding]. Je komt nu in [Afbeeldingsbeheer], waar je alle op de server beschikbare afbeeldingen van de website ziet staan. Klik in op het icoon Uploaden (rechts): Je komt nu in het [Upload] venster. Klik op [Bladeren] en selecteer de afbeelding vanaf je eigen computer, daarna op [Openen]. Klik op [Upload] => als er een groen vinkje achter verschijnt dan is de afbeelding naar de website geüpload. Nu zie je de nieuwe afbeelding ertussen staan. Ga hiermee verder. Wijzigen van een bestaande afbeelding m.b.v. de JCE tekstverwerker Open het Artikel of Module waar de afbeelding in gewijzigd moet worden. Klik op de blauwe link van de module waarin zich de afbeelding bevindt. Aangepaste uitvoer Bij Aangepaste uitvoer zie je de betreffende foto. blad 7 van 14
Selecteer de te wijzigen afbeelding: je ziet nu grijpkaders. Klik op het icoon Invoegen/wijzigen afbeelding. Je komt nu in Afbeeldingsbeheer, waar je in de middelste kolom alle op de server beschikbare afbeeldingen van de website ziet staan. De bestaande foto, met zijn instellingen, zie je hier geselecteerd. Als je deze wilt wijzigen: selecteer dan in de middelste kolom de gewenste foto (of upload deze eerst, zie vorige hoofdstuk) => de instellingen worden automatisch overgenomen van de bestaande foto. o Belangrijk: als je bestaande foto s vervangt, zorg er dan voor dat het formaat van de foto hetzelfde is als de bestaande foto!!! (zie het volgende hoofdstuk) Als je niet weet wat dit betekent laat het dan over aan 4 Your Webdesign om foto s te vervangen. o Denk ook aan: Uitlijning links of rechts; marges (ruimte) om de foto heen; rand om de foto; Pas hier NOOIT de Afmetingen aan, maar doe dat m.b.v. Photoshop en upload de foto opnieuw. Kies [Bijwerken]. De pagina is nu gewijzigd met de nieuwe foto. Foto s bewerken Nieuwe foto s kun je alleen toevoegen na bewerking met een fotobewerkingspakket (bv. Photoshop). Zorg ervoor dat alle foto s die je gebruikt voor de website zoveel mogelijk in hetzelfde formaat (bv. 200x150 pixels) en 72 dpi worden opgeslagen. Neem het formaat over van bestaande foto s op de website, zodat dit overal hetzelfde blijft! Instructie Photoshop Elements: Open de betreffende afbeelding via: Bestand Openen. Kies: Afbeelding Uitsnijden Vul voorgedefinieerde formaten in: o Breedte, bv.: 200 px o Hoogte, bv.: 150 px o Eventueel: Resolutie: 72 pixels/inch, maar gaat via Opslaan voor Web automatisch. Optimaliseren foto: blad 8 van 14
o Verbeteren Niveaus bepalen o Verbeteren Autocontrast o Verbeteren Automatische kleurcorrectie o Verbeteren Automatisch verscherpen Sla de afbeelding op via: Bestand Opslaan voor Web. Selecteer JPEG, Hoog, Kwaliteit = 60, ICC-profiel = aan [OK]. Je kunt een foto wel makkelijk verkleinen, maar niet vergroten (of kijk in dat geval wat het resultaat ervan is). Fotobewerkingspakketten In andere fotobewerkingspakketten zal de werking ongeveer gelijk zijn. Ook online heb ook je diverse mogelijkheden voor aanpassingen aan foto s, zoals bv. www.splashup.com/splashup/ o Google er eens op en je ziet vele mogelijkheden en demonstraties. www.fototool.nl o De werking lijkt op Photoshop. Om dit onder de knie te krijgen moet je hier gewoon mee gaan werken en het een en ander uittesten. www.fotoverkleinen.nl o Kies een foto op de computer. o Vul de gewenste maximale maat in. o Klik op Klik hier om de foto op te slaan op je computer. o Upload deze via het CMS vanaf je computer naar de website. Artikelen / Pagina s toevoegen Belangrijk: Het principe van menu en artikelen bestaat uit: Eerst zorgen voor het artikel => Inhoud > Artikelen Er zijn ook Modules beschikbaar die per pagina te positioneren zijn => Extensies > Modulebeheer (m.b.v.: Positie en Menutoewijzing). Hang het artikel daarna aan het menu => Menu s > Selecteer het betreffende Menu. Toevoegen artikel - via kopiëren van een bestaand artikel Dit is handig omdat je dan alle opmaak meeneemt en deze dus direct bij de hand hebt. Ga naar Artikelbeheer. Je ziet hier alle artikelen die gepubliceerd of gedepubliceerd zijn. Voor het zoeken naar een artikel kun je op de kolomtitel klikken om hierop te sorteren of een filter plaatsen op status of categorie. Net wat je handig vindt. blad 9 van 14
Open een artikel die lijkt op het artikel die je wilt toevoegen. Klik rechts bovenin op [Opslaan als kopie]. Pas nu alles aan wat gewenst is. Zie Werking JCE-tekstverwerker uit het vorige hoofdstuk. Houd in alle artikelen vooral dezelfde opmaak aan, bv. o Titel = Kop 2 o Subtitel = Kop 3 o Een vette kopregel = Paragraaf + vet o De tekst = Paragraaf De bijbehorende opmaak hiervan is namelijk vastgelegd in het css-bestand (= stylesheet en alleen door de webdesigner aan te passen). Selecteer de juiste Categorie en, indien van toepassing, de juiste Taal. Het daadwerkelijk zichtbaar maken van dit artikel op de website gaat via Menu s, dus onderstaande kun je altijd invullen: o Status: Gepubliceerd Kies [Opslaan & sluiten]. Wijzigen van artikelen / pagina s (kan ook via de frontoffice) Dit kan dus het gemakkelijkst via de voorkant van de website, maar kan dus ook via de achterkant: Ga naar: Artikelbeheer. Plaats eventueel rechtsboven een filter op Selecteer status of -categorie. Klik op de blauwe link van de Titel van het te wijzigen artikel. Pas de tekst aan en sla het artikel op.!!!!!!!!!!! CONTROLEER WIJZIGINGEN ALTIJD VIA DE WEBSITE!!!!!!!!!!! Menu s Toevoegen menukeuze Weergave artikel Ga naar Menubeheer en klik op het menu waarin de nieuwe menukeuze moet komen. Kies [Nieuw]. Menu-item naar Artikel: Selecteer bij menu-itemtype: Individueel artikel. Selecteer bij Selecteer artikel: [Selecteren/Wijzigen] => het betreffende artikel die je net hebt aangemaakt of aan het menu wilt hangen Ga eventueel met [Volgende =>] naar de volgende 20 artikelen of plaats een filter (let op: dit filter is de volgende keer opnieuw actief). blad 10 van 14
Klik op de Titel (= hyperlink) van het betreffende artikel. De naam van het artikel wordt nu ingevuld. Vul deze titel ook in bij Menutitel én Alias. o LET OP: er mogen geen 2 dezelfde aliassen binnen de website bestaan. Hoofditem: Dit is meestal Menu-item root, waardoor hij aan het hoofdmenu gehangen wordt, maar als het een submenu moet worden selecteer je hier eventueel het menuitem waarin het artikel onder moet komen. Het scherm ziet er dan als volgt uit: Status: Gepubliceerd. Toegang: Publiek (is meestal het geval). Locatie menu: hier kun je van menu wisselen! Doelvenster: Hoofd Standaard pagina: alleen de Home-page staat op Ja. Taal: selecteer de juiste taal bij een meertalige website. Templatestijl: Gebruik standaard. blad 11 van 14
Paginaweergave opties Het meeste is al via Artikelen > Opties ingesteld, dus kun je [Gebruik algemeen] aanhouden. Browserpaginatitel: geef hier (meestal) de naam van de pagina in. Deze wordt als titel in de browser getoond. Toon paginakop: Meestal Nee, maar vul deze in zoals op de andere pagina s! Als je nu op [Opslaan] klikt dan is het artikel toegevoegd. Controleer dit direct! Je kunt de volgorde nog wijzigen via: In Menubeheer kun je: o Met de Volgorde-pijltjes de volgorde van de menu-items regelen. (Tijdelijk) uitzetten van een menu-item: Als je bepaalde pagina s op je website niet wilt tonen kun je deze het gemakkelijkst (tijdelijk) uitzetten. Ga naar Menubeheer. Klik bij het gewenste menu-item op het groene vinkje => Gepubliceerd wordt nu een rood rondje = Gedepubliceerd. De menukeuze is nu niet meer zichtbaar via de website. Deze kun je eventueel later weer AANzetten via Publiceren. DIT IS ALLES. Wil je echt grondig verwijderen, dan: Selecteer de betreffende menukeuze door er een vinkje voor te plaatsen en kies [Prullenbak]. o Denk er dan ook aan om het bijbehorende artikel te verwijderen via Artikelbeheer! Na toevoegen menu-item => DENK AAN: weergeven Modules Als je een menu-item hebt toegevoegd, en deze gelinkt hebt naar een Artikel en je merkt dat in deze nieuwe pagina bepaalde onderdelen niet worden getoond, dan moeten bepaalde Modules in deze pagina ook nog worden aangezet. Dat gaat als volgt: Ga naar Extensies > Modulebeheer. Selecteer de Module(s), die op iedere of een bepaalde pagina zichtbaar moet(en) zijn. Stel bij Menutoewijzing het nieuwe menu-item in. Kies [Opslaan]. Voeg zo eventuele andere modules ook toe aan bepaalde pagina s/menu-items. blad 12 van 14
Gebruikersbeheer Ga naar: Gebruikersbeheer. Raadpleeg eerst een bestaande gebruiker met dezelfde autorisatie. Klik op [Nieuw]. Vul de gewenste gegevens in (zie voorbeeld hieronder). Kies [Opslaan]. De toegevoegde gebruiker krijgt nu automatisch een mail op het ingevulde e-mailadres met daarin zijn inlognaam en wachtwoord. Vrijgeven vastzittende pagina s Melding het artikel wordt bewerkt Als je een melding krijgt dat een artikel op dit moment wordt bewerkt door iemand anders, dan is er óf iemand anders bezig met deze pagina óf iemand is er verkeerd uitgegaan na het bewerken, namelijk met het kruisje rechts bovenin i.p.v. met [Annuleren] of [Opslaan]. Ga dan naar Artikelbeheer. Selecteer het betreffende artikel (met het slotje). Kies rechts bovenin: [Inchecken]. Je ziet dan aan het verdwenen slotje dat het artikel weer is vrijgegeven. Of: meteen voor de hele website: Ga naar Website > Onderhoud > Algemene check-in. Selecteer alles en kies [Inchecken]. blad 13 van 14
Beheer In principe verzorgt 4 Your Webdesign de updates van Joomla! en de extensies, maar als je toch iets gaat doen of veel wijzigingen gaat aanbrengen, maak dan éérst een backup! 4 Your Webdesign kan daarmee altijd relatief snel de status weer terugzetten. Backup Zie: Componenten > Akeeba Backup [Backup nu]. Backup commentaar: vul in wat de aanleiding is. Bv. Voor aanpassingen. [Maak nu een backup]. o Er wordt nu een backup gemaakt van alle bestanden en de database. o Dit duurt even. Heb geduld! o Als de backup mislukt, doe je hem gewoon opnieuw. Meestal gaat het daarna wel goed. Klik na afloop op Beheer backup-bestanden. Klik op [Deel 00] en sla deze lokaal op. E I N D E De belangrijkste onderwerpen zijn in deze handleiding uitgelegd. Het meeste is een kwestie van uitproberen. Er wordt voor de zekerheid regelmatig een backup (van de database) gemaakt. Als het echt fout gaat kun je die terug laten zetten. Dit wordt dan wel als onderhoud in rekening gebracht. Heb je nog vragen? Mail ze naar: info@4yourwebdesign.nl blad 14 van 14