Thematische verschillen tussen Drupal 6, 7 en 8

Dit is een lijst van enkele van de meest opvallende wijzigingen in Drupal 8 die invloed hebben op theming.

Meer informatie

1. Drupal 8 genereert standaard semantische HTML5-markup (zie de Drupal 8 HTML5-initiatieven) vergeleken met XHTML in Drupal 6 en 7.
2. Naast jQuery v2.x bevat Drupal 8 nu meer front-endbibliotheken zoals Modernizr, Underscore.js en Backbone.js.
3. De coremodule RDF in Drupal 8 genereert schema.org-markup.
4. Drupal 8 heeft verbeterde toegankelijkheid dankzij breed gebruik van WAI-ARIA-attributen.
5. Drupal 8 introduceert Twig, dat PHPTemplate vervangt als standaard theming engine. Dit betekent dat theme_* functies en PHP-gebaseerde *.tpl.php bestanden zijn vervangen door *.html.twig()-templates.
6. Drupal 8 bevat standaard functies die prestaties verbeteren, zoals CSS- en JavaScript-aggregatie.
7. Drupal 8 levert nieuwe UI-elementen die je in je eigen adminschermen gebruikt, waaronder modale dialogen en drag-and-drop-knoppen.
8. Drupal 8 bevat responsive functies zoals responsive thema’s, toolbar, afbeeldingen en tabellen.
9. In Drupal 6 en 7 moest je functies gebruiken zoals drupal_add_css() en drupal_add_js() om CSS of JS aan een specifieke pagina toe te voegen. Nu wordt dit vervangen door JS/CSS-resources toe te voegen via de #attached eigenschap van render arrays met behulp van libraries.
10. Drupal 8 heeft geen ondersteuning meer voor IE 6, 7 en 8, waardoor gebruik van jQuery 2.0 en andere code die moderne HTML5/CSS3 browsers vereist mogelijk is.
11. Drupal 8 ondersteunt geen browsers zonder SVG-ondersteuning (inclusief IE8 en Android Browser 2.3)
12. Drupal 8 bevat minder ID’s in CSS dan Drupal 7.
13. De CSS-bestandsstructuur van Drupal 8 is gebaseerd op SMACSS en BEM.
14. CSS in Drupal 8 gebruikt CSS3-pseudo-selectors.
15. Drupal 8 wordt geleverd met Classy, een basisthema dat klassen in markup injecteert en de bijbehorende CSS bevat. Dit vervangt veel preprocess-functies en CSS-bestanden die eerder in coremodules zaten.
16. Drupal 8 verplaatst CSS-klassen van preprocess-functies naar Twig-templates.
17. Drupal 8 gebruikt breakpoint media queries om de weergave van de site op verschillende apparaten te beheren.

CSS-klassewijzigingen tussen D7 en D8

Menu

D7:

• Updaten van thema’s 7.x naar 8.x
• Wijzigingsmelding voor themers
• Sqndr Drupal 8 theminggids
• Ultieme Drupal 8-gids: Aflevering 5 - Verbeteringen voor front-end ontwikkelaars

.menu li.expanded
.menu li.collapsed
.menu li.leaf
.menu li.active-trail
.menu li.first
.menu li.last

D8:

.menu-item--expanded
.menu-item--collapsed
.menu-item--active-trail
.menu-item:first-child
.menu-item:last-child

.menu-item--leaf werd zelden gebruikt, dus is verwijderd. Dit kan terug toegevoegd worden. Zie voorbeeld https://www.drupal.org/node/2425691#comment-9629101
@todo vervangen door link in deze documentatie.