help center

Search
Close this search box.
On this page

Adjust the Lightbox settings

Last Update: June 23, 2024

The Elementor Lightbox opens images, galleries, carousels, and videos in a 100% mobile responsive lightbox popup window


The lightbox feature is turned on by default. You can switch it off by going to its settings, and adjusting the toggles.

To access the Lightbox settings:

  1. From the Top Bar, click the Site Settings icon.
    Click site settings Adjust the Lightbox settings 1
    This opens the settings that affect the entire site.
    Click Adjust the Lightbox settings 3
  2. In the left panel, click Lightbox.
    LIghtbox options Adjust the Lightbox settings 5
    The Lightbox options appear.
    Click Save Changes Adjust the Lightbox settings 7
  3. Make any desired changes and click Save Changes.

Lightbox options

The Lightbox tab enables you to adjust the following global Lightbox settings:

Image LightboxToggle to enable or disable the lightbox globally. If toggled to Yes, any image element linked to a media file will become a lightbox.
CounterFor multi-image galleries only. If toggled on, adds an image count to the upper left corner of the lightbox. For example, if the gallery contains 6 images, the counter will display 1/6, 2/6, etc. to indicate “First of 6 images”, “Second of 6 images”, etc.
FullscreenToggle to Yes to add  a clickable icon allowing visitors to open the image in a full screen lightbox.
ZoomToggle to Yes, to add a clickable icon to allowing visitors to zoom in on the image in the lightbox. Once you zoom into an image, you’ll be able to pan the view and scroll across the different areas of the image.
ShareToggle to Yes to allow visitors to share images on social media, or download it to their computer.
TitleOptionally display a title under the image in the lightbox. Select from None, Title, Caption, Alt, or Description.
DescriptionOptionally display a description under the image in the lightbox. Select from None, Title, Caption, Alt, or Description.
Background ColorChoose the background color and opacity of the lightbox. For more details, see Choose a color or Use global fonts and colors.
UI ColorChoose the default color of the lightbox arrow and dot navigations, the Close button, and other user interface elements.. For more details, see Choose a color or Use global fonts and colors.
UI Hover ColorChoose the color of the lightbox arrow and dot navigations, the Close button, and other user interface elements. When visitors hover over them.. For more details, see Choose a color or Use global fonts and colors.
Text ColorChoose the color of the text appearing in the lightbox. For more details, see Choose a color or Use global fonts and colors.
Toolbar Icons SizeSet the size of the toolbar icons representing functions such Zoom, Share, Fullscreen and Close. For more details, see, Units of measurement.
Navigation Icons SizeFor Lightboxes containing more than one image. Set the size of the icons that move to the next or previous image. For more details, see, Units of measurement.

Note
All of the above functionality is mobile responsive. Visitors can zoom, open images and videos in full screen, and share the images from their mobile phones.

Have more questions? We’re more than happy to assist.

Link is copied to clipboard!
On this page

Is this article helpful?

Share this article

Stuck?
Our Elementor Expert is Ready

Book a 45-min video consultation call with an Elementor expert and elevate your site!