The thumbnail strip displays small previews of all gallery items in a scrollable strip alongside the main item. Visitors can click any thumbnail to jump directly to that item, making it easy to navigate large galleries without using arrows.
Location Gallery Settings → Interactions → Lightbox Settings → Thumbnail Strip
Thumbnail Strip Location #
| Setting | Thumbnail Strip Location |
| Options | Bottom Top Left Right None |
| Default | Bottom |
Where the thumbnail strip appears relative to the main item.
- Bottom / Top — A horizontal row of thumbnails below or above the item.
- Left / Right — A vertical column of thumbnails to the side. Useful for landscape-oriented galleries where vertical space is available.
- None — Disables the thumbnail strip entirely.
All other thumbnail settings are hidden when Thumbnail Strip Location is set to None.
Thumbnail Size #
| Setting | Thumbnail Size |
| Options | Small Normal Large |
| Default | Normal |
| Visible when | Thumbnail Strip Location is not None |
Sets the overall size of each thumbnail tile in the strip. The exact pixel dimensions adapt to the strip orientation and viewport.
Space Between Thumbnails #
| Setting | Space Between Thumbnails |
| Range | 0–20 |
| Units | px |
| Default | 5px |
| Visible when | Thumbnail Strip Location is not None |
Gap between individual thumbnails in the strip. Set to 0 for a seamless, edge-to-edge strip.
Drag Thumbnails #
| Setting | Drag Thumbnails |
| Default | On |
| Visible when | Thumbnail Strip Location is not None |
When enabled, visitors can click and drag the thumbnail strip horizontally (or vertically, for left/right strips) on desktop to scroll through a large gallery. The strip responds to pointer drag events — no scrollbar is shown.
Swipe Thumbnails #
| Setting | Swipe Thumbnails |
| Default | On |
| Visible when | Thumbnail Strip Location is not None |
When enabled, the thumbnail strip responds to touch swipe gestures on mobile and tablet. Passive touch listeners are used so the strip does not interfere with page scrolling.
How the Active Thumbnail Works #
The thumbnail for the currently displayed item is always highlighted using the active thumbnail color, and automatically scrolled into view when navigation changes the active item. Scrolling is smooth (scroll-behavior: smooth).
When using the Custom theme, three color controls are available for the strip — Thumbnail Strip Background, Thumbnail Border, and Active Thumbnail Highlight. See Lightbox: Custom Colors.
