Wat

gaan we leren

Drupal theming

Drupal theming

• Week 1 t.e.m. 6
• Eigen themes maken
• Andere themes uitbreiden
• Twig template systeem - HTML
• CSS
• JavaScript
• Images/video

Drupal Modules

• Eigen themes maken
• Andere themes uitbreiden
• Twig template systeem - HTML
• CSS
• JavaScript
• Images/video

Drupal Modules

• Week 7 t.e.m 12
• Custom modules maken
• Bestaande modules uitbreiden
• Allerlei Drupal API's, zoals
  • Form API
  • Views API
  • Blocks API
  • Entity API
  • ...
• Symfony
• Config Management

Schedule*

1. Recap "Wat is drupal" + Anatomie
2. Anatomie van een theme
3. Twig templating & libraries
4. Javascript & Drupal
5. Best practices & advanced theming
6. Praktijk

* Subject to change

Anatomie

van een theme

Summary

• Wat is een theme
• Common uses
• Soorten themes
• Theme UI
• Drush
• Anatomie
• Tips
• Praktijk

Wat is een theme

D8 "definition"

A theme is a collection of files that define the presentation layer. You can also create one or more "sub-themes" or variations on a theme.

https://www.drupal.org/docs/8/theming

Thema

Html, CSS, JS

PHP

MySQL

API's

Inheritance

Sub-themes are just like any other theme, with one difference: They inherit the parent theme's resources. There are no limits on the chaining capabilities connecting sub-themes for their parents. A sub-theme can be a child of another sub-theme, and it can be branched and organized however you see fit. This is what gives sub-themes great potential.

Common uses

Waarom een theme gebruiken?

Multisites

• One codebase
• Two themes

Landingpages

Seasonal

Soorten themes

Ready made

• Themes zoals:

  • https://themeforest.net/category/cms-themes/drupal

• Meestal slechte integratie

  • Weinig/moeilijk aanpasbaar

  • Focus: snel up & running

Starterthemes

• Themes zoals:

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

  • https://www.drupal.org/project/zurb_foundation

  • https://www.drupal.org/project/neato

• Goede integratie

  • Componenten van frameworks werken Out of the box

  • Meestal inclusief startertheme

• ​Veel custom werk

Corethemes

/core/themes

• bartik (default)
• classy
• seven (admin)
• stable
• stark

Onze focus

=

Custom theme

Theme UI

Live demo

Permissions

• Administer themes
  • Toegang tot het beheer van themes
• View the admin theme

Drush

Like modules

$ drush en <name>

$ drush pm-uninstall <name>

$ drush cr

Tips

Disable cache & aggregation

admin/config/development/performance

Je ziet je wijziging niet?

Clear cache!

$ drush cr

Andere errors debuggen?

1. Drupal error log

/admin/reports/dblog

Andere errors debuggen?

2. Apache error log

In Acquia Dev Desktop

Click on Acquia Dev Desktop

=> Preferences => Logs => View Apache Errors