Whenever you’re on a website, click on an image or page element, and it enlarges while the rest of the web page greys out behind it; that’s a lightbox. It’s a panel that functions as an overlay on your website pages, focusing the viewer’s attention on a featured image or page element in all its glory, until they click the “X” in the corner and close the lightbox, re-setting the page view to normal. The overlay functionality is also known as a modal window or child window.
Like the lights going down in a cinema, or a spot-lit painting in a gallery, a lightbox darkens the surroundings to focus the viewer’s attention on one thing. Here’s a nice example. Note that you can scroll left or right to view more images in this example – it’s a lightbox gallery. If you’re a photographer housing your images in a gallery plugin on your website (such as FooGallery), you can enable scrolling of multiple gallery images in a compatible lightbox.
A lightbox in WordPress includes navigation arrows which enable the viewer to scroll through gallery items without having to open images individually, which would mean opening individual tabs and cluttering up their browser. On a mobile phone, the viewer can swipe left or right, rather than click on the arrows.
Last updated May 27, 2022
Applies to: Other