GLightbox logo
GLightbox field widget settings
Image without caption
Image with caption

GLightbox is a pure javascript lightbox. It can display images, iframes, inline content and videos with optional autoplay for YouTube, Vimeo and even self-hosted videos:
https://biati-digital.github.io/glightbox/

GLightbox Drupal module contains only images field formatter for now. You can install GLightbox Media Video module to support YouTube, Vimeo:
GLightbox Media Video

For loading local videos, iframes, inline elements or AJAX content loading, you can use GLightbox Inline module.

Usage GLightbox Inline

  • Enable GLightbox Inline module. No other options or configuration exist.
  • Add the class `glightbox-inline` to an element and make href value a selector for the element you wish to open. Eg,
    <a class="glightbox-inline" href="#user-login">User Login</a> will open a popup with the first element with the id #user-login as the content.
  • Optional add data-glightbox to the link to control the size of the modal window, for example data-glightbox="width: 700; height: auto".
  • If you want to display page in popup, just add path in href attribute: href="/node/42" or href="https://drupalbook.org"
  • - You also can set href attribute with URL to video or image, for example: href="https://drupalbook.org/sites/default/files/video.mp4 or YouTube video href="https://youtu.be/g2coDPosRSs. Video will be playing automatically in popup.
  • - See more examples here: https://biati-digital.github.io/glightbox/

Looking for Image gallery module? You can try these modules with GLightbox integration:

Looking for Video gallery module? You can try these modules with GLightbox integration:

Features

The GLightbox module:

- Works as a Formatter in entities and in views.
- Excellent integration with core image field and image styles and the Insert
module

The GLightbox plugin:

- Small - only 11KB Gzipped
- Fast and Responsive - works with any screen size
- Gallery Support - Create multiple galleries
- Response Images Support - Let the browser use
the optimal image for the current screen resolution
- Video Support - YouTube, Vimeo and self-hosted videos with autoplay
- Inline content support - display any inline content
- Iframe support - need to embed an iframe? no problem
- Keyboard Navigation - esc, arrows keys, tab and enter is all you need
- Touch Navigation - mobile touch events
- Zoomable images - zoom and drag images on mobile and desktop
- API - control the lightbox with the provided methods
- Themeable - create your skin or modify
the animations with some minor css changes

Supporting organizations: 

Project information

Releases