FG AutoLightbox

1. Featured image CSS selector

The featured image is rendered by the template outside the article text, so the plugin cannot see it by default. Enter a CSS selector in the plugin settings (here .demo-hero img) and it gets the lightbox as well.

2. Automatic gallery

Images in the article text are wrapped on the server and grouped per article. Open one and move through the whole set.

3. Separate galleries

Each article is its own group. These two images belong to a different article, so the arrows stay inside this pair and never jump to the gallery above.

4. Images added later watch dynamic

Images inserted by scripts after the page has loaded (infinite scroll, tabs, accordions, AJAX) are picked up automatically. Press the button, then click the new picture.

5. Opt-out for single images

Give an image the CSS class noshadow (configurable under Exclude CSS classes) and the plugin leaves it alone. Same image, two behaviours:

What it does

• Wraps every image in article text automatically - nothing to configure for editors.
• Gallery per article with arrows, keyboard, swipe and neighbour preloading.
• Accessible dialog: focus trap, Esc to close, focus returns to the clicked image.
• Uses the biggest available source (data-full, srcset) for the enlarged view.
• Caption from alt text or file name; respects prefers-reduced-motion.
• Works with images added later, and with images outside the article via CSS selectors.
• Filters: allowed file extensions, minimum image width, excluded classes, categories, articles and URLs.
• Lightweight: no jQuery, no external libraries, one small script and stylesheet.

Install

Requires Joomla 6 and PHP 8.3 or newer.