Planning to develop responsive theme using Drupal 7 & Bootstrap 3?

What is this article about?

If you are planning to develop a responsive theme using Drupal 7, then this guide may help you build the theme quickly.

First of all you will need to add Bootstrap 3 theme to themes directory of the Drupal installation(under sites/all). This theme will be refereed as a base theme.

Why Bootstrap 3 as a base theme?

Some theme developers may have this question. The reason to add bootstrap 3 as a base theme is, it overrides most of the theme functions to add bootstrap classes to common elements(e.g. It adds form-group & form-control classes to the form elements). This helps reduce efforts of overriding theme functions.

How to create bootstrap sub-theme?

Bootstrap theme comes with bootstrap sub-theme starter kit. You can start development of your theme with the help of starter kit by copying it in the themes directory. It is good practice to keep contributed themes like Bootstrap under contrib directory(e.g. sites/all/themes/contrib/bootstrap) & your own themes under custom directory(e.g. sites/all/themes/custom/your_theme_name).

Click here to know more developing themes in Drupal.

Are there any contributed modules to enhance bootstrap theme development?

Yes, there are some contributed modules which may help you enhance bootstrap themes as listed below:

Views Bootstrap 

This module helps you build bootstrap components like Grid, Tables, Thumbnail, Media object, Accordion, Carousel, Tabs, List group.

Display Suite Bootstrap Layouts

This module works with display suit to provide extra layouts.

Panels Bootstrap Layouts

Similar to display suite bootstrap layouts, this module provides extra layouts for panels

What we learnt?

We can develop bootstrap themes quickly with the help of Bootstrap theme as a base theme & we can enhance it with some contributed modules such as views bootstrap, Display Suite Bootstrap Layouts, Panels Bootstrap Layouts.

I hope this guide will help you build responsive themes using bootstrap 3 in Drupal 7.

(This article does not cover development of the theme).

bootstrap3panelsdisplay suiteviewslayouts