Colorbox example with the default style

Colorbox is a light-weight customizable lightbox plugin for jQuery. This module allows for integration of Colorbox into Drupal.

Images, iframed or inline content etc. can be displayed in a overlay above the current page.

Features

The Colorbox module:

  • Works as a Formatter in entities and in views.
  • Excellent integration with core image field and image styles and the Insert module
  • Choose between a default style and a number of other styles that are included.
  • Style the Colorbox with a custom Colorbox style in your theme.
  • Drush command, drush colorbox-plugin, to download and install the Colorbox plugin in sites/all/libraries.

The Colorbox plugin:

  • Compatible with: jQuery 1.3.2+ in Firefox, Safari, Chrome, Opera, Internet Explorer 7+
  • Supports photos, grouping, slideshow, ajax, inline, and iframed content.
  • Lightweight: 10KB of JavaScript (less than 5KBs gzipped).
  • Appearance is controlled through CSS so it can be restyled.
  • Can be extended with callbacks & event-hooks without altering the source files.
  • Completely unobtrusive, options are set in the JS and require no changes to existing HTML.
  • Preloads upcoming images in a photo group.
  • Well vetted and currently in use in over 600,000 websites.
  • Released under the MIT License

The plugin is separate downloaded.

Installation for Drupal 7 (2.x)

Download and install the Libraries API 2 module and the Colorbox module as normal. Then download the Colorbox plugin. Make sure to use the 1.x branch since that will stay backwards compatible with older jQuery version, like the ones included with Drupal.

Download Colorbox plugin 1.x

Unpack and rename the plugin directory to "colorbox" and place it inside the "sites/all/libraries" directory. Make sure the path to the plugin file becomes: "sites/all/libraries/colorbox/jquery.colorbox-min.js"

Form support in Colorbox is removed in 7.x-2.x

Use Modal forms (with ctools) instead or one of the other modules that has this feature, there are a number of them.

The attempt to support opening various forms in a Colorbox was in hindsight never a good idea. Form error handling and form redirects are complicated, a lot of code would be needed to do it correctly.

If you absolutely want to continue using the form support you need to stay with 7.x-1.x.

Colorbox screencasts

Part 1 to 3 is for an older 7.x-1.x version of the Colorbox module.

Contributed screencasts:

Modules that extend Colorbox

Modules that have built in support for Colorbox

Dependencies

You need to download the Colorbox plugin from the site above, the git repo doesn't contains the minified version so will not work. The easiest way to download and install the plugin is via the built in Drush command, drush colorbox-plugin.

For Drupal 6 users

The latest version of the Colorbox plugin, 1.3.19+, needs jQuery 1.4.3+. Drupal 6 users need to use the old 1.3.18 version of the plugin. It can be downloaded from the link below.

Old 1.3.18 version

Colorbox is on D6 maintainer search: Interested in becoming a (co-)maintainer of the Drupal 6 branch?

Similar modules

Please read the article Comparison of Lightbox-type modules.

Project Information

Downloads