Als je het bestand page.html.twig van het thema Stable opent:

/core/themes/stable/templates/layout/page.html.twig

Dan zul je zien dat het verschilt van het page.tpl.php-template van Drupal 7, ten eerste door de extensie en ten tweede door het overvloedige gebruik van accolades {}. Dit komt doordat Drupal gebruikmaakt van de Twig-template-engine.

In eerdere tutorials hebben we al CSS aan ons thema gekoppeld. Hiervoor hebben we in het bestand drupalbook.info.yml het volgende aangegeven:

libraries:
  - drupalbook/global-styling

Vervolgens hebben we het bestand drupalbook.libraries.yml aangemaakt, waarin we hebben aangegeven welk CSS-bestand moet worden ingeladen:

We hebben al gezien dat Drupal Twig ingebouwd heeft en hoe je het kunt gebruiken. In dit artikel bespreken we hoe je met Drupal-templates werkt, welke templates er in het Stable-thema aanwezig zijn, hoe je deze kunt overschrijven en hoe je templates van verschillende Drupal-entiteiten kunt aanpassen.

Laten we beginnen met de templates van het Stable-thema. Ga naar de templatesmap van het thema Stable:

Om een nieuwe regio toe te voegen waarmee je blokken kunt weergeven, moet je het volgende doen:

• Voeg informatie over de regio toe aan het bestand theme.info.yml
• Bewerk het bestand page.html.twig en voeg daar de weergave van de nieuwe regio toe

Regio’s toevoegen aan het bestand drupalbook.info.yml

Alle regio’s worden gedefinieerd onder de sleutel regions:

Om te beginnen bekijken we hoe we aangepaste JavaScript-bestanden aan ons thema kunnen toevoegen. In het bestand .libraries.yml moet je het JavaScript-bestand opnemen:

Heel vaak voldoet de standaard Views-template niet aan onze wensen, dus kunnen we de templates voor Views overschrijven. Helaas heeft Views geen gebruikersinterface om de juiste template te vinden, maar we kunnen wel gebruikmaken van patronen om templates te herdefiniëren.

Meer over patronen lees je in dit artikel:

6.6. Werken met templates in Drupal. Wat zijn de templates in de core van Drupal.

In het bijzonder zijn we geïnteresseerd in het volgende:

Drupal is niet alleen een CMS, het is ook een platform voor het ontwikkelen van webapplicaties. Als je besluit om je eigen thema te maken, zul je verschillende frameworks vinden die hiervoor geschikt zijn. In dit artikel bekijken we de populairste daarvan.

Bootstrap

https://www.drupal.org/project/bootstrap

http://getbootstrap.com/

Drupal heeft maar weinig kant-en-klare, mooie en functionele thema’s. Maar Drupal integreert heel eenvoudig met allerlei externe bibliotheken en services. Zo kun je bijvoorbeeld een thema maken op basis van Bootstrap en tegelijkertijd profiteren van de volledige kracht van Drupal. In deze sectie van de site drupalbook.org bespreken we hoe je snel en gemakkelijk thema’s kunt maken vanuit elk ontwerp.

In eerdere lessen hebben we al bekeken hoe je een thema kunt maken op basis van een ander thema, zoals Stable. In deze les laten we zien hoe je een thema maakt op basis van Bootstrap, een populair framework voor het snel bouwen van paginalay-outs.

Voordat je begint met ontwikkelen in Drupal 8, moet je de cache uitschakelen. In tegenstelling tot Drupal 7 wordt in versie 8 niet alleen de cache van entiteiten, views en velden opgeslagen, maar ook de gecompileerde Twig- en render-templates. Om al deze caches uit te schakelen, moet je het volgende doen.

1. Kopieer het bestand /sites/example.settings.local.php naar /sites/default/settings.local.php.

Dit bestand bevat al de nodige instellingen om de cache uit te schakelen.