EC Lightbox is a minimal WordPress plugin that adds a modern lightbox to galleries using
GLightbox.
The plugin is opt-in by behavior: once activated, it only applies its lightbox functionality to blocks where you explicitly add a custom CSS class (for example, a Gallery block). Everywhere else, WordPress behaves normally.
Features
- Uses GLightbox for a clean, responsive lightbox.
- Works with WordPress core blocks (e.g. Gallery, Image).
- Opt-in activation via a custom CSS class (
ec-lightbox).
- Groups images by gallery container (each block with
ec-lightbox is its own gallery).
- Includes a Settings page in WordPress Admin.
- Configurable behavior: loop, touch navigation, zoom.
- Local vendor assets by default (no hard dependency on external CDNs).
Requirements
- WordPress 5.0+
- PHP 7.0+
- A block-based setup (Gutenberg) is recommended.
Installation
- Install EC Lightbox via the WordPress.org plugin repository or by uploading the files to your server.
- Activate EC Lightbox from Plugins → Installed Plugins.
- (Optional) Review default options in Settings → EC Lightbox.
The plugin ships with local GLightbox assets already included — no external downloads are required.
How to enable EC Lightbox on a Gallery block
- Insert a Gallery block.
- Select the Gallery block itself (not a single image inside it).
- In the block sidebar, configure:
- Link to →
None
- Disable “Open in lightbox” / “Enlarge on click” if present.
- Open the Advanced panel.
- Add the following class:
ec-lightbox
- Update or publish the post.
When users click an image inside that gallery, EC Lightbox will open and allow navigation through the gallery.
Note:
Make sure individual images inside the gallery do
not have click settings assigned.
If these WP-native actions remain enabled, WordPress will attach its own click/lightbox behavior, overriding this plugin.
⚙️ Settings Page (WordPress Admin)
A configuration screen is available at:
Settings → EC Lightbox
Available options:
- Loop images
- Enable touch navigation
- Enable zoom
- Autoplay videos (for future video support)
All settings are passed directly to the lightbox JavaScript on initialization.
🧩 Filters & Developer API
1. Modify GLightbox options programmatically
php
add_filter( 'ec_lightbox_js_options', function ( $options ) {
$options['loop'] = true;
$options['zoomable'] = false;
$options['openEffect'] = 'zoom'; // Any GLightbox option is accepted
return $options;
});
Options merged from:
1. Plugin defaults
2. Admin settings
3. This filter (highest priority)