Inhoud 1
2
3
Wat is Drupal?
1
De geschiedenis van Drupal Contentmanagementsysteem (CMS) Open source Community De technologie achter Drupal Proudly found elsewhere
2 2 3 4 4 5
Drupal installeren
7
Aan de slag Een lokale server installeren Download Acquia Dev Desktop 2 Een nieuwe site starten Alternatieven Op een shared hosting Een database configureren Drupal op de juiste plaats zetten Drupal configureren Taal en profiel Vereisten Database Probleemoplossing
8 8 8 9 10 10 10 10 11 11 12 12 14
Het admin-systeem
17
Het Management-menu
18
xi
Inhoud
4
5
6
7
8
xii
Pagina’s toevoegen
19
Inhoud van de site Homepagina Het nodesysteem Pagina’s bewerken
20 21 23 24
Menu’s
27
Menu bewerken vanaf de node Overzicht menu’s Menulinks bewerken Volgorde aanpassen Nieuwe items toevoegen Bestaande menu-items bewerken Menulinks verwijderen
28 29 30 30 30 32 32
Blokken
35
Blokken inschakelen Blokken instellen Zelf een blok maken
36 38 39
De lay-out veranderen
41
Structuur van een thema Meegeleverde thema’s Thema veranderen Thema instellen Beheerthema Thema downloaden Thema uitschakelen Starterthema’s
42 42 43 44 46 46 49 49
Gebruikersbeheer
51
Personen Rollen Rol toevoegen Toegangsrechten Gebruiker toevoegen
52 52 53 54 55
Handboek – Drupal 8
9
10
11
Taxonomie
59
Woordenlijst Termen
60 61
Inhoudstypen
63
Entiteit Een nieuw inhoudstype maken Velden beheren Getalveld toevoegen Afbeeldingveld toevoegen Taxonomie toepassen op inhoudstype Weergave beheren Andere weergave Formulierweergave beheren Velden, Weergave en Formulierweergave beheren op andere entities
64 64 67 69 71 73 75 77 77 78
Modules
79
Packages Core versus contrib Statussen Dependencies Belangrijkste kernmodules Actions Activity tracker Block Book CKEditor Comment Configuration Manager Contact Custom Block Custom Menu Links Database logging Field Forum Node Path Quick Edit Responsive Images Search Taxonomy
80 80 81 81 82 82 82 82 82 82 83 83 84 84 84 84 84 84 85 85 85 85 85 85
xiii
Inhoud
12
13
xiv
Update manager User Views Views UI Veldtypen Datetime File Image Link List Number Options Telephone Text Experimentele modules Modules voor meertaligheid Modules voor webservices Contrib-modules Modules vinden Hoe herken je een goede module? Een module downloaden Een module installeren Een module gebruiken
85 86 86 86 86 86 86 86 86 87 87 87 87 87 87 88 88 88 88 89 90 91 92
What You See Is What You Get
93
Invoerformaten Formaten en editor instellen De editor testen Verschillende knoppen Link invoegen/bewerken Formaat Vanuit Word plakken Een afbeelding invoegen/bewerken
94 95 97 97 97 98 99 99
Views
101
Wat zijn views? Een nieuwe view maken Views bewerken Naam voor weergave Titel Formaat Filtercriteria
102 103 105 106 106 106 108
Handboek – Drupal 8
14
15
16
17
Sorteercriteria Pagina-instellingen Kop, Voet en Gedrag bij ontbreken van resultaten Paginering Uitgebreid Een tweede weergave toevoegen Fields Sorteercriteria willekeurig Paginering 1 tonen Andere weergaven Operations
112 112 113 113 114 115 116 117 117 118 118
Contactformulier
119
Basisinstellingen Velden, weergave en formulierweergave beheren
120 122
Zoekmachineoptimalisatie (SEO)
123
Vuistregels Adressen Automatische adressen Metatags Google Analytics
124 124 125 128 133
Media
135
Overzicht Bestandsysteem Afbeeldingsstijlen Beeldbewerkingstoolkit Mediabrowser Velden voor andere media
136 136 138 140 141 141
Drupal onderhouden
143
Cron Een back-up maken Nieuwe Drupal-versies Beveiliging Bijwerken Onderhoudsmodus Oude versies vervangen door nieuwe versies
144 145 148 149 149 151 151
xv
Inhoud
18
19
20
xvi
Rapporten
155
Statusrapportage Beschikbare updates Recente logberichten Populairste zoekwoorden Meest voorkomende fouten: ‘Geen toegang’ Meest voorkomende fouten: ‘Pagina niet gevonden’
156 157 157 158 159 159
Meertaligheid
161
Inleiding Talen toevoegen Detectie en selectie Language switcher Inhoud vertaalbaar maken Inhoud vertalen Inhoudstypen Taxonomie Andere entities Paden Configuratie vertalen Inhoudstypen vertalen Views vertalen Interface vertalen
162 162 163 164 165 166 166 167 168 168 170 170 171 173
Een eigen thema maken
175
Mapstructuur Info-file Libraries CSS SMACSS en BEM JavaScript Dependencies Verdere informatie Basisthema’s Stable Classy Regio’s Templates Debugging Template-bestanden
176 177 178 179 180 181 182 182 182 183 183 184 186 186 188
Handboek – Drupal 8
21
22
A
Twig Commentaar Iets zeggen Iets doen Filters Breakpoints Theme-bestand Nuttige links
190 191 191 193 194 194 196 197
Drush
199
Installatie Versie bepalen Beschikbare commando’s Meest gebruikte commando’s drush en modulename drush pmu modulename drush up drush ard en drush arr drush cr drush cron drush upwd drush ws
200 200 201 201 201 201 202 202 202 202 202 202
Eerste hulp bij problemen
203
Problemen met het boek README.txt Issue queue Drupal-forum Drupal.be en Drupal.nl Drupal Answers – Stack Exchange Google Drupal-bedrijven en -freelancers
204 204 204 204 205 205 205 205
Overige kernmodules
207
Aggregator Automated cron Ban Breakpoint Color Contextual links Field SQL
208 208 208 208 208 208 209
xvii
Inhoud
Field UI Filter Help History Internal Page Cache Menu UI RDF Shortcut Statistics Syslog System Testing Toolbar Tour
B
C
xviii
209 209 209 209 209 210 210 210 210 210 210 210 211 211
Verschillen met Drupal 7
213
Nieuwe modules WYSIWYG in de core Views in de core Meertaligheid Allemaal entities HTML 5 en CSS3 Responsive Configuration Management
214 214 214 214 215 215 215 215
Website online zetten: stappen en checklist
217
Checklist
218
Index
219
1
Wat is Drupal?
D
rupal is een zogenoemd contentmanagementsysteem (CMS). Letterlijk vertaald betekent dit ‘inhoudsbeheersysteem’. Het gaat daarbij dus over het beheren van de inhoud van een site, en niet zozeer over de code of de software achter de site. Dit hoofdstuk introduceert Drupal.
Je leert in dit hoofdstuk:
Wie Drupal heeft uitgevonden. Waar de naam Drupal vandaan komt. Wat een CMS is. Wie eigenaar van de Drupal-code is. Welke technologieën Drupal gebruikt.
Hoofdstuk 1 – Wat is Drupal?
De geschiedenis van Drupal Drupal werd uitgevonden in het jaar 2000 door Dries Buytaert toen hij in Antwerpen studeerde. Het begon als een discussieplatform voor hem en de medebewoners van zijn kot (studentenkamer). Toen hij en zijn kotgenoten afstudeerden, besloten ze om de site online te zetten, zodat ze met elkaar in contact konden blijven. Het was toen dat Drupal een naam kreeg. Dries wilde eigenlijk dorp.org registreren, omdat dit een passende naam was voor de kleine gemeenschap (community). Bij het nakijken of dorp.org nog niet in gebruik was, maakte hij een tikfout, waarna hij uiteindelijk uitkwam bij drop.org. Na verloop van tijd veranderde het publiek van de website, en de leden begonnen te discussiëren over nieuwe webtechnologieën. Aan de hand van ideeën die op de website geplaatst werden, werd ook de software achter de site uitgebreid. In januari 2001 besloot Dries de code achter de website vrij te geven als ’Drupal’. Zo konden andere geïnteresseerden experimenteren met de code en deze uitbreiden. De naam Drupal is afkomstig van de Engelse uitspraak van het Nederlandse woord ‘druppel’, dat op zich weer het Nederlandse woord is voor het Engelse ’drop’. Over de jaren heen is de basis (core) van Drupal uitgebreid, maar ook de modules uit de community (contrib) zijn explosief gegroeid. Inmiddels zijn er tienduizenden modules beschikbaar.
4.2
Contentmanagementsysteem (CMS) Drupal is een zogenoemd contentmanagementsysteem (CMS). Letterlijk vertaald betekent dit ‘inhoudsbeheersysteem’. Het gaat daarbij dus over het beheren van de inhoud van een site, en niet zozeer over de code of de software achter de site. Een CMS maakt het voor iedereen mogelijk om websites te bouwen. Een grondige technische kennis van programmeertalen en webtechnologieën – zoals PHP, HTML en CSS – is niet noodzakelijk. Betekent dit dat Drupal niet geschikt is voor mensen met een technische achtergrond? Nee, integendeel, ook voor hen is Drupal bijzonder nuttig. Met een
2
Handboek – Drupal 8
contentmanagementsysteem als Drupal kan de ontwikkeltijd enorm ingekort worden. Het is niet meer nodig om, bijvoorbeeld, zelf een aanmeldingssysteem te programmeren, een verbinding met de database te maken, lijsten op te halen en een betalingssysteem te ontwerpen. Een van de grote voordelen van Drupal is dat het niet alleen een CMS is, maar ook een framework. Het stelt ontwikkelaars in staat om (op eenvoudige wijze) eigen modules maken. Momenteel zijn er tienduizenden modules beschikbaar, met de meest uiteenlopende functionaliteiten. Vind je toch niet wat je nodig hebt? Geen probleem, je kunt zelf een module (laten) maken of aanpassen.
Open source Drupal is ‘open source’. Dit betekent niet alleen dat het gebruik van Drupal gratis is, maar ook dat iedereen de achterliggende code kan bekijken. Die code is geen goed bewaard geheim, zoals bijvoorbeeld bij SharePoint van Microsoft. Er is ook geen bedrijf dat eigenaar is van de code. Er is wel een vereniging – de Drupal Association – die de code beheert en die bepaalt welke wijzigingen er in de verschillende versies worden opgenomen. Het staat anderen echter vrij om een eigen versie van Drupal bij te houden en aan te passen. Zo is, bijvoorbeeld, Backdrop (zie www.backdropcms.org) een ‘fork’ van Drupal 7.
3
Hoofdstuk 1 – Wat is Drupal?
Community Dankzij het feit dat Drupal en zijn code vrij beschikbaar zijn, is er een grote gemeenschap (community) rond Drupal ontstaan. Het zijn allemaal mensen die zich gratis inzetten om van Drupal een nog beter product te maken. Niet alleen programmeurs, maar ook ontwerpers, managers, gebruikers en nog heel wat andere mensen dragen er hun steentje aan bij. Deze community organiseert ook regelmatig evenementen en bijeenkomsten. Het grootste evenement is DrupalCon, dat tweemaal per jaar wordt georganiseerd: eenmaal in Europa (meestal in het najaar) en eenmaal in de Verenigde Staten (meestal in het voorjaar). Maar er zijn ook kleinere bijeenkomsten zoals DrupalCamps, DrupalJams, Drupal User Groups en zelfs DrupalBars. Alle evenementen worden aangekondigd op http://drupal.be en http://drupal.nl. Er zijn zowel evenementen voor beginners als voor meer ervaren Drupal-gebruikers.
De technologie achter Drupal Drupal is opgebouwd uit PHP, (X)HTML, CSS en JavaScript. PHP is een programmeertaal die het mogelijk maakt om een website dynamisch te laten reageren. Zo reageert Drupal anders op aangemelde gebruikers dan op niet-aangemelde gebruikers. Het is ook mogelijk om te reageren op datum, tijd, parameters in het adres, gegevens in de database en heel wat meer. Dat is heel goed, maar een browser begrijpt geen PHP. Wat de browser wel begrijpt, is (X)HTML. Daarom genereert de PHP-code op de server (X)HTML en stuurt dit door naar de browser. Als er alleen (X)HTML weergegeven wordt, ziet een pagina er maar heel saai uit. Daarom is er ook CSS nodig. CSS is de afkorting van Cascading Style Sheets. Met deze technologie kun je kleuren, lettertypen, breedtes, hoogtes, achtergronden en alle andere grafische kenmerken aanpassen. JavaScript zorgt er dan weer voor dat er wijzigingen aan de pagina kunnen worden aangebracht nadat de bezoeker deze al geladen heeft. Zo kun je, bijvoorbeeld, foto’s laten bewegen in een diavoorstelling, een uitklapbaar menu tevoorschijn toveren (kan in moderne browsers met CSS) en onderdelen tonen en verbergen. (X)HTML, CSS en JavaScript worden uitgevoerd of geïnterpreteerd door de browser aan de kant van de bezoeker, maar PHP moet worden uitgevoerd door de server. Bij voorkeur is dit een Apache-server die werkt op het besturings-
4
Handboek – Drupal 8
systeem Linux. Drupal heeft ook een database nodig om te kunnen werken. De meest gebruikte database voor Drupal is MySQL. Linux, Apache, MySQL en PHP zijn open source en werken perfect met elkaar samen. Soms wordt er naar deze technologieën ook verwezen met LAMP. Als Apache, MySQL en PHP op Windows geïnstalleerd worden, spreekt men van WAMP; bij installatie op Mac van MAMP. Als je op je eigen pc wilt testen, kun je, afhankelijk van je besturingssysteem, een LAMP, WAMP of MAMP installeren. Om je site online te zetten, kun je echter beter kiezen voor een LAMP.
Proudly found elsewhere In Drupal 8 zijn verschillende onderdelen te vinden die niet door de Drupalcommunity zelf ontwikkeld zijn. Dit zijn componenten van bijvoorbeeld Symfony (https://symfony.com), Guzzle (http://guzzle.readthedocs.org) en PHPUnit (https://phpunit.de). Voordelen daarvan: • Het maakt Drupal betrouwbaarder omdat het op bewezen componenten kan steunen. • Het maakt Drupal gemakkelijker te onderhouden, omdat niet alles door de Drupal-community onderhouden hoeft te worden. • Het maakt Drupal toegankelijker voor ontwikkelaars die, bijvoorbeeld, al met Symfony werken.
5
2
Drupal installeren
I
n dit boek gaan we samen de website bouwen van restaurant Drupalia. Deze case wordt als rode draad gebruikt. Je bent vrij om van het ene hoofdstuk naar het andere te springen, maar we bouwen steeds verder op dezelfde installatie.
Je leert in dit hoofdstuk:
Wat een ‘distribution’ is. Waar je Drupal kunt downloaden. Welke mappen en bestanden je beschrijfbaar moet maken. Wat er speciaal aan user 1 is.
Hoofdstuk 2 – Drupal installeren
Aan de slag Je kunt zelf gemakkelijk aan de slag met Drupal. Eerst heb je een server nodig. Je kunt deze online huren (hosting) of je kunt een server installeren op je eigen pc. Als je hosting hebt geregeld, kun je de volgende paragraaf overslaan. Als je nog op zoek bent naar hosting, kijk dan eens op http://www.maartendeblock.be/ hosting voor enkele suggesties.
Een lokale server installeren Download Acquia Dev Desktop 2 Acquia Dev Desktop 2 is een zogeheten development stack speciaal ontwikkeld voor Drupal. Het bevat een webserver, een database-server, PHP en verschillende tools om snel en gemakkelijk van start te kunnen gaan. Ga naar https://www.acquia.com/products-services/dev-desktop en download het installatiebestand voor jouw besturingssysteem. Je moet een account maken om het installatiebestand te kunnen downloaden.
8
Handboek – Drupal 8
Een nieuwe site starten Na de installatie kom je automatisch op Select a Drupal distribution to start from. Hier kun je kiezen welke versie van Drupal je wenst te installeren. Bovenaan staat de meest recente versie van Drupal 8, eronder Drupal 7 en verder verschillende installatieprofielen. Een installatieprofiel is een voorgeconfigureerde versie van Drupal voor een specifiek doel, bijvoorbeeld COD voor het organiseren van conferenties. Hier kiezen we uiteraard voor Drupal 8. Vervolgens wordt er gevraagd waar je de site wenst te installeren. Kies een lokale map op je computer. Let op: zet je website niet in een beveiligde map zoals Program files. Gebruik de volgende opties: • • • •
Local site name: drupalia Use PHP: 7 Database: Create a new database New database name: drupalia
Klik vervolgens op Finish.
De installatiebestanden worden automatisch gedownload en je website wordt klaargezet. Om de installatie te starten klik je vervolgens op de URL naast Local site. Als je de standaardinstellingen gevolgd hebt, is dat http://drupalia.dd:8083 of http://drupalia.dd:8083/core/install.php.
9
Hoofdstuk 2 – Drupal installeren
Alternatieven Als je al aan webontwikkeling werkt met PHP is het goed mogelijk dat je bijvoorbeeld al XAMPP, MAMP of WAMP gebruikt. Deze zijn ook perfect bruikbaar voor een Drupal-installatie. Je moet dan wel zelf de database aanmaken en tools zoals Drush (www.drush.org) installeren.
Op een shared hosting Een database configureren Bij de meeste hostings is er al een database geconfigureerd. Je hebt de volgende gegevens nodig: • • • •
host (vaak ’localhost’) gebruikersnaam wachtwoord databasenaam
Als je deze informatie niet ontvangen hebt van je hostingprovider, moet je mogelijk nog een database maken via het controlepaneel van je hosting. Lukt dit niet? Neem dan contact op met de helpdesk van je hostingprovider.
Drupal op de juiste plaats zetten Ga naar https://www.drupal.org/ en klik bovenaan in het menu op Download & Extend. Klik op Download Drupal en scroll naar beneden. Klik vervolgens op zip voor Windows of op tar.gz voor Mac en Linux. Pak het bestand uit in een tijdelijke map. Upload de inhoud van de map (niet de map zelf) naar je webroot. Welke map dit precies is, heb je normaal gezien vernomen van je hostingprovider. Zo niet, raadpleeg dan de helpdesk van je hostingprovider. Veelvoorkomende mappen zijn: • • • • • • •
10
/htdocs/ /var/www/html/ /var/www/ /domains/domeinnaam.com/public_html/ /public_html/ /web/ /