Les 3

Updates van modules en thema's

Drupal is een CMS die constant evolueert. Performance en veiligheid worden steeds opnieuw bijgesteld. Daarom is het ook nodig dat de Drupal installatie up to date blijft. Er zijn twee soorten updates:

  • De kern
  • Modules en thema's

Het is deze laatste die we even bekijken.

  1. Ga naar Rapporten - Statusrapportage
  2. Zoek vervolgens op de verschenen pagina naar de gele opmerking:

  1. Klik nu op de blauwe link 'beschikbare updates'
  2. Vink in het volgende venster alles aan en kies 'Deze updates downloaden'

  1. In het volgende venster wordt u aangeraden een back-up te nemen. Dat is goed advies maar in het geval van onze oefensite (nog) niet nodig. Klik Doorgaan
  2. Vervolgens moet ook de databank op updates worden gecontroleerd. Voer daarom het updatescript uit. Let ook even op de URL

  1. Tot slot kies je voor Voorpagina en de alles staat up to date

Opdrachten

  1. Op de huidige home-page zie je telkens de teaser van de schilders en schilderijen. Merk onderaan ook de volgende en vorige knoppen op!
  2. Zorg ervoor dat enkel de teaser van de schilderijen te zien is

  x6

  1. Op diezelfde homepage zien we nu enkel de teaser van de schilderijen. Een klein fotootje van het schilderij zou leuk zijn. Dit kan je regelen bij de weergave van het inhoudstype. Kies hier dit keer wel voor de teaser:

 

  1. Download en installeer als standaard het thema Professional Responsive Theme
  2. Zorg ervoor dat
    1. Er geen copyright of credits worden getoond
    2. De sociale media symbolen niet zichtbaar zijn
    3. Het favicon en logo aangepast wordt. Gebruik eventueel deze afbeelding:

  1. De blokken moeten aangepast worden. Zet op autohidden:
    1. Breadcrumbs
    2. Search
    3. Footer Menu
  2. Het blok Page Title is opnieuw uitgeschakeld. Schakel opnieuw in
  3. Zorg voor een nieuwe afbeelding ter vervanging van het blauw/zwarte raster. Gebruik volgende foto:

  1. Voor diegene die in plaats van Inhoud nog steeds Content hebben staan gaan dit even vertalen:
    1. Ga naar Instellingen en kies User Interface Translation
    2. In het verschenen venster zoek je naar Content en je vertaald het vervolgens naar Inhoud

Bestandsbeheer met FTP

De bestanden op de de server kunnen op twee manieren worden benaderd. Een eerste manier is rechtstreeks via het cpanel van jouw domein, een andere is via een ftp-programma zoals FileZilla.

Via het cpanel

  1. Log in op het Cpanel, de gegevens kreeg je via mail van Neostrada.
  2. Kies Bestandsbeheer

f

  1. Kies Public HTML

p

  1. In de meeste gevallen ga je bestanden en mappen beheren in ...sites/default/files
  2. Kies de gewenste mappen
  3. Upload of download bestanden.

u

Via FileZilla

  1. Download de gratis Client van Filezilla
  2. Log in, ook deze gegevens kreeg je van de hosting per mail

f

  1. De host is jouw domeinnaam, voorafgegaan door ftp (ftp.domeinnaam.be)
    1. De gebruikersnaam is dezelfde als bij het cpanel
    2. Het wachtwoord is dezelfde als bij het cpanel
    3. De poort hoef je niet in te vullen
  2. Links in beeld heb je toegang tot de harde schijf
  3. Rechts heb je toegang tot de server
  4. Het uploaden kan via de rechtermuisknop, of via verslepen

fi

Menu instellen

In de vorige les hebben we reeds menu-linken voorzien voor al onze schilders en schilderijen. We merken op dat het menu zonder aanpassingen een beetje druk begint te worden. We kunnen dit oplossen door uitklapbare menu's te creëren.

  1. Ga naar Structuur - Menu's - Hoofdnavigatie

  1. Je ziet een lijst met alle reeds ingestelde menulinken. Merk ook de kruisjes op. Met deze kruisjes kan je de volgorde aanpassen. Zorg ervoor dat 'Home' op de eerste plaats staat.

  1. Plaats nu de schilders en schilderijen zoals hierboven. Dit wil concreet zeggen dat we de schilder bij zijn schilderij gaan plaatsen.
  2. Met hetzelfde kruisje kan je nu de schilderijen laten inspringen onder de schilder:

  1. Door op te slaan kan je het resultaat gaan bekijken. Dit zal tegenvallen. De schilderijen klappen niet uit. We keren terug naar de instellingen van het hoofdmenu. Naast elke schilder dien je op Bewerken te klikken en een vink te zetten bij Uitgeklapt Weergeven:

  1. Resultaat:

Homepage instellen

Wanneer je de website niet voorziet van een eigen ingestelde Homepage of Frontpage dan zal Drupal automatisch teasers tonen van als jouw toegevoegde inhoud. Dit is handig voor een blog, niet meteen voor ons.

  1. Maak een nieuwe node aan van het type Eenvoudige pagina.
    1. Titel: Welkom
    2. Tekst: Welkom op mijn site
  2. Zorg ervoor dat de URL niet automatisch gemaakt wordt en geef deze zelf in: /welkom

  1. Sla dit even op
  2. Ga nu naar Instellingen - Systeem - Basis site-instellingen

  1. Pas de standaardvoorpagina aan door de jou gekozen URL in te geven:

Herhalingsoefening

In de vorige les hebben we inhoud toegevoegd in inhoudstypes. We doen dit vandaag opnieuw ter herhaling.

Download de nodige bestanden

  1. Voeg een nieuw inhoudstype toe: Musea
  2. Vergeet niet om 'Auteur en datum' uit te vinken
  3. Voeg een nieuw veld toe:
    1. Veldtype: Tekst (plat)
    2. Label: Adres
    3. In de volgende vensters mogen de instellingen gewoon blijven zoals ze zijn
  4. Voeg opnieuw een veld toe:
    1. Bestaand veld: Afbeelding
    2. In de volgende vensters mogen de instellingen blijven staan zoals ze zijn
  5. Zorg ervoor dat er ook voor dit nieuwe inhoudstype url-aliassen worden aangemaakt, doe dit VOOR je inhoud gaat toevoegen.
  6. Voeg nu de 5 musea toe, gebruik hiervoor de gedownloade bestanden. Let op: een menulink is hier voorlopig niet nodig

Nieuw veld: lijst

Bij de musea willen we graag de mogelijk om in een lijstje te kiezen in welk land de verschillende musea zich bevinden.

  • Open het veldenbeheer van het inhoudstype Musea

  • Voeg een nieuw veld toe:

  • Voeg nu handmatig een lijstje in met mogelijke landen. We kiezen hier logischerwijs de landen van onze musea:

  • Sla dit op en in het volgende veld kan je ook gewoon opslaan.
  • Bewerk nu telkens de inhoud van de musea. Je zal merken dat er een veld is bijgekomen en dat je het land kan selecteren:

Weergave beheren

Je hebt het misschien gemerkt maar de afbeeldingen van onze musea zijn ofwel heel erg groot ofwel aan de kleine kant. Het is voor een bezoeker veel aangenamer om deze allemaal in dezelfde grootte te zien verschijnen.

  1. Ga naar Structuur - Inhoudstypen - Musea - Weergave beheren

  1. Merk naast het afbeeldingsveld het kleine grijze tandwieltje op.

  1. Klik daar even op en je krijgt volgend instellingsveld:

  1. Afbeeldingsstijl:
    1. Geen: hier kies je gewoon de originele foto
    2. Groot: een stijl die de afbeelding gaat bijsnijden op 480x480 pixels
    3. Gemiddeld: idem maar dan 220x220
    4. Miniatuur (Thumbnail): idem maar dan 100x100

  1. Link afbeelding naar:
    1. Niets: wanneer de bezoeker op de foto klikt gebeurt er niets
    2. Inhoud: de inhoud van de foto zal getoond worden, in dit geval gebeurt er dus niets want je kijkt al naar de inhoud
    3. Bestand: de foto wordt groot getoond in een nieuw venster

  1. Test de verschillende mogelijkheden uit.
  2. Kies uiteindelijk voor Groot en Bestand
  3. Vergeet niet om telkens op Bijwerken te klikken gevolgd door Opslaan

Colorbox

Colorbox is een leuke module voor het weergeven van foto's. Helaas dis deze module third party, dit wil zeggen dat we handmatig een plugin moeten installeren op onze server in de juiste map. Daarnaast moet ook de module zelf geïnstalleerd worden.

  1. Download de plugin naar de map download en zorg dat deze mooi uitgepakt klaar staat.
  2. We downloaden het FTP programma FileZilla
  3. Nu maken we connectie met de site via FTP, open het programma FileZilla
  4. Bovenaan kan je door het invullen van de gegevens inloggen, de gegevens heb je gekregen in de bevestigingsmail bij het aankopen van jouw domein

  1. Wanneer de connectie is gelukt, dan zie je links in beeld de harde schijf van jouw computer en rechts de mappen structuur op de server

  1. Zorg ervoor dat je in het linker venster de uitgepakte map colorbox ziet staan. Rechts open je jouw submap
  2. Maak nu zelf een map aan libraries. Deze zit niet automatisch in de installatie. Naar de toekomst toe zullen alle plugins hierin worden geplaatst.

  1. Zorg dat in het rechter venster de nieuwe map libraries geopend is

  1. Klik rechts op de map colorbox en kies uploaden

  1. Keer terug naar jouw site. Download, installeer en activeer de module Colorbox
  2. Voor colorbox iets van nut kan hebben moeten we er eerst voor zorgen dat we wat meer afbeeldingen hebben bij onze schilders:

Download deze bestanden

  1. Bewerk nu een schilder naar keuze en probeer eens om een foto toe te voegen. Dit gaat helaas niet.
  2. Open het veldenbeheer van het inhoudstype schilder

  1. Klik op Bewerken bij het veld afbeelding

  1. Klik in het verschenen venster op het tabblad veldinstellingen, we negeren de rode melding

  1. Onderaan zie je dat de toegestane waardes op 1 staan, we veranderen dit even naar Onbeperkt

  1. Vergeet niet op te slaan
  2. Bewerk nu de inhoud van alle eerder toegevoegde schilders, gebruik vervolgens de inhoud van de gedownloade bestanden om bij elke schilder twee foto's toe te voegen

  1. Na dit werk open je de weergave van het inhoudstype schilder

  1. Pas nu het formaat aan van het afbeeldingsveld naar colorbox

  1. Klik nu op het grijze tandwiel ter hoogte van het afbeeldingsveld
  2. We overlopen volgende instellingen klassikaal:

  1. Klik zeker op Bijwerken gevolgd door opslaan
  2. Bekijk het resultaat
  3. Mogelijk opmerkingen / problemen:
    1. De afbeeldingen blijken niet allemaal even groot te zijn
    2. De afbeeldingen staan niet mooi naast elkaar als je naar de node kijkt
  4. --> problemen om op te lossen in de volgende les