Stap 12

Stap 12

In deze stap gaan we de modules Bootstrap paragraphs, Bricks for Bootstrap en Switch Page Theme gebruiken.

Het resultaat vindt u hier

voorbereiding.png  VOORBEREIDINGEN

Installeer en activeer volgende module(s):

Of installeer met composer en activeer op normale wijze (plak deze 3 regels ineens):

  • composer require drupal/bootstrap_paragraphs
    composer require drupal/bricks_bootstrap
    composer require drupal/switch_page_theme

Installeer en activeer volgende thema's (niet als standaard instellen):

 

Of installeer met composer en activeer op normale wijze (plak deze 3 regels ineens):

  • composer require drupal/bootstrap
    composer require drupal/breeze:^1.11
    composer require drupal/tweme

 

instructions.png  INSTRUCTIES

Bricks [for] Bootstrap

Een kanjer van een module...waar er heel wat over te vertellen valt. Het is een vervanger van Display Suite, Panels, Paragaphs,... lesfiche

Steunt op het Bricks principe waar  je geen Bootstrap voor nodig hebt. Maar met een Bootstrap 4 thema komen alle voordelen aan bod. Bootstrap 4 thema's zijn nu nog zeldzaam, maar dit zal zeker toenemen. Laat het duidelijk zijn... Deze module draait dus enkel op Bootstrap 4 thema's zoals 'Tweme'. Dit thema is simpel en er wordt verwacht dat je wat CSS toevoegt. Dit kan perfect omdat Bootstrap thema's classes hebben die vooraf gedefinieerd zijn.

Ik ga de werking van Bricks for Bootstrap uiteenzetten met een voorbeeld.

Hier zie je 3 tabs. De eerste (painting) toont in 2 kolommen een afbeelding en tekst. Op zijn beurt is de tekstkolom onderverdeeld in 2 afbeeldingskolommen.

Drupal8 002563

De tweede tab (painter) bestaat uit drie kolommen. Twee afbeeldingen en een stukje tekst.

Drupal8 002564

De derde tab toont een accordeon met een stukje tekst..

Drupal8 002565

en een slideshow. Dit alles werd met Bricks gemaakt. Tabs, Accordeon, Kolommen, Slideshow,... zitten ingebouwd.

Drupal8 002566

 

Bootstrap Paragraphs

Deze module is een concurrent van de Bootstrap Bricks module.Een beetje minder flexibel, maar met meer mogelijkheden voor de opmaak. Het werkt met de Bootstrap 4 thema's zoals Breeze. Dit zorgt voor reeds mooie CSS. lesfiche

Werkt enkel in combinatie met Bootstrap 3 thema's of subthema's

Standaard kan je kiezen tussen deze paragraaf types. (je kan er zelf toevoegen natuurlijk om bvb een video veld te tonen)

 

Drupal8 002600

Een voorbeeld van gelijke kolommen met drie items.

Drupal8_002601.png

Heb je maar 2 items? Dan heb je maar 2 kolommen. Responsive natuurlijk.
 Drupal8_002602.png