A Bootstrap Carousel image with text
Configuration of Bootstrap Carousel

Overview

Bootstrap Carousel module provides a very easy way to make carousels, based on bootstrap-carousel.js.

Features

  • Bootstrap Carousel content type. So you can create a carousel using node/add/bootstrap-carousel;
  • One carousel per node, so you can have any number of carousels to be displayed within your website;
  • Simple method of adding slides to the carousel using multiple values field;
  • Configuration for each carousel in node create/edit page;
  • Alt attribute for images;
  • Interval time, in miliseconds;
  • Control options (arrows, bullets, pause image cycling on mouse hover);
  • Responsive design;
  • Works with Panels;
  • Youtube Video Support.

Requirements

Bootstrap Carousel has four dependencies:

Drupal core modules

  • Field
  • Field SQL Storage

Contributed modules

Sponsorship

This project has been sponsored by CI&T.

Installation

To install Bootstrap Carousel:

  1. Download the latest compiled version of Bootstrap, or download it customized (it is required to check JS Components/Carousel and jQuery plugins /Carousel). Extract it to sites/all/libraries or sites/sitename/libraries as you require. The extracted folder must be named bootstrap.
  2. Enable Bootstrap Carousel and all of the modules that it requires.
  3. Configure the jQuery Update module to use jQuery 1.7 or higher.

Tips and Tricks

You can overwrite in your theme the carousel template: node--bootstrap_carousel.tpl.php.

For example, if you want a preset style for images. See: Vali Hutchison Comment

Similar projects

Mobile development tip

Weinre
Weinre is a debugger for web pages, like FireBug (for FireFox) and Web Inspector (for WebKit-based browsers), except it's designed to work remotely, and in particular, to allow you debug web pages on a mobile device such as a phone.

Project Information

Downloads