Het Bootstrap HTML framework in Drupal, we love it. Maar waarom eigenlijk? Er zijn alternatieven om te integreren bij Drupal websites. Hierbij een aantal redenen waarom wij momenteel voor het Bootstrap framework kiezen.
Waarom een überhaupt een HTML framework
Allereerst, waarom überhaupt een HTML framework gebruiken? Deze mogelijkheden bestaan ook:
1) Geheel met de hand alles schrijven: Tegenwoordig is responsiveness vereist bij zo goed als elke nieuwe website. Bootstrap biedt cross-browser compatibility hiervoor. Om deze benodigde responsiveness zelf elke keer opnieuw te gaan bouwen zou nergens op slaan.
2) Kant en klare Drupal themes Je kunt gratis Drupal themes downloaden, of deze kant en klaar kopen. Je komt daarmee al snel een heel eind in de goede richting, maar ‘the devil is in the details’. Die laatste details zijn meestal een drama, maar noodzakelijk om er jouw gewenste layout van te maken. Meestal is dat een drama omdat je de code niet kent en die code vaak niet schaalbaar is opgezet voor jouw doeleinden, het is een soort Rube goldberg machine voor je.
Waarom Bootstrap
Dus, een HTML framework is our weapon of choice. Specifiek Bootstrap, 5 redenen waarom:
#1) Goede documentatie
Het is inmiddels een zeer veel gebruikt framework in Drupal. Het Drupal Bootstrap basis theme hiervoor gaat momenteel naar de 300.000 downloads en 50.000 installaties. Niet alleen al in de Drupal community wordt deze ingezet, andere populaire CMS-en, zoals Wordpress, maken er ook veel gebruik van.
Door deze brede inzet is er erg veel documentatie en zijn meeste vragen al beantwoord op fora als StackOverflow.
#2) Goede Drupal integratie
Gezien wij een Drupal shop zijn, is schaalbaarheid en lenigheid van de integratie noodzakelijk. Dit is voor handen, het Drupal Bootstrap basis theme zit uitstekend in elkaar. Zelfs een integratie met Bootswatch themes, waardoor je direct kunt kiezen uit 14 kant en klare templates.
Wij maken hier zeer dankbaar gebruik van in onze Drupal distributie OpenLucius.
#3) Veel kant en klare gratis templates
Omdat het wereldwijd wordt gebruikt, zijn er vele websites die betaald en onbetaald Bootstrap HTML templates aanbieden, bijvoorbeeld:
- http://bootswatch.com/
- https://wrapbootstrap.com/
- http://startbootstrap.com/
- http://bootstrapzero.com/
#4) Veel componenten (snippets) zijn al beschikbaar
Website bestaan veelal uit soortgelijke content: homepage, lijstpagina's, nieuws items, blog, contact, homepage, uitklapmenu, een slider met foto’s, etc, etc. Maar denk ook aan elementen als een profiel pagina, een timeline, of een loginscherm.
Er zijn vele websites die zulke componenten (snippets) aanbieden binnen het Bootstrap HTML framework. Enkele voorbeelden:
Een Timeline
- http://bootsnipp.com/snippets/featured/timeline-responsive
- http://bootsnipp.com/snippets/featured/two-column-timeline-not-responsive
Een Profielpagina
Een bruikbare dropdown selector met filterfunctie
Deze hebben we gebruikt in OpenLucius:
Data tables
Data tables zorgen voor performance optimalisatie ten opzichte van standaard Drupal Views. Data tables laadt namelijk alle ‘tabular data’ in, en maakt pagina’s met behulp van jQuery. Op deze manier scheelt dat server requests bij aanroep van elke nieuwe pagina.
#5) Integreerbaar met WYSIWYG
Wanneer je met content managers werkt wil je graag dat zij de tekstopmaak direct zien zoals de bezoeker. Oftewel: de tekst in de wyiwyg-editor moet consistent zijn met het front-end. Met Bootstrap kan dit relatief eenvoudig.
Relevante Drupal modules
Aan de slag met Bootstrap in Drupal, dit zal je een kickstart geven:
- Bootstrap Drupal base theme
- Views Bootstrap
- Panels Bootstrap Layouts
- Bootstrap Tour
- Bootstrap fieldgroup
En nog een zooitje. Niet alles in dit laatste rijtje is bootstrap integratie, er staan ook resultaten in van modules die iets zeggen over ‘Drupal’s bootstrap proces’. Dat is weer een geheel ander hoofdstuk :)
Wrap up
Alright, that's it, vragen of feedback welkom uiteraard!