Twitter Bootstrap

by
Alec Reynolds
| May 5, 2012
Birds on a wire

Share

TwitterLinkedinFacebookEmail

Twitter Bootstrap is one of the newest buzzwords you may have heard flying around developer circles. The promise is appealing: a standardized library of CSS (by way of LESS) styles and jQuery scripts that bring clean Web 2.0 aesthetics, responsive design, and a bunch of UX enhancing components in an easy-to-use bundle. However, how do we use Bootstrap with Drupal? Below we'll explore several themes and potential pathways to utilize Twitter Bootstrap in your next Drupal site.

Open Framework Theme

Open Framework is a theme developed by Brian Young at Stanford. At this moment, it's only available through Brian's GitHub repository.

Advantages:

  • Simple implementation, easy for themers only familiar with HTML/CSS/Basic PHP to understand.
  • No companion module or need to install Bootstrap as an external library

Disadvantages:

  • Relies upon template files (instead of preprocess functions) to implement Bootstrap classes. This means you won't get much Bootstrap styling beyond the basic blocks and other elements themed by the template files.
  • Doesn't utilize the correct structure for including external APIs, meaning that it will (probably) never be a full-fledged project on drupal.org (and thus not benefit from community support).

Twitter Bootstrap Theme/Twitter Bootstrap UI Module

Twitter Bootstrap is a project on Drupal.org. Because the Twitter Bootstrap code isn't allowed within projects hosted on Drupal.org and it isn't considered a great practice to include external libraries directly within modules and themes, you'll have to download Boostrap separately. At the moment, the easiest way to install the Twitter Boostrap theme is to install the Twitter Boostrap UI module.

Advantages:

  • Commited projects with (interesting) community comments and support.
  • Utilizes preprocess functions to theme a wider range of elements than Open Framework.
  • Takes a more minimilistic approach to template files (you might find this more pleasing as a coder).

Disadvantages:

  • Have to integrate an additional module.

The Future

https://drupal.org/project/kalatheme

Alec Reynolds

Alec Reynolds

Co-Founder

When his long-standing interest in programming and this "internet thing" became relevant to his entrepreneurial inclinations, Alec found himself helping launch a series of startups. This experience has provided Alec with a deep understanding of young businesses and the product development process, where he participates from the code to the customer.