Lightbox

10Web Website Builder includes a highly responsive Lightbox feature, perfect for displaying images, galleries, carousels, and videos in an engaging popup window. This feature adapts seamlessly to mobile devices, ensuring a consistent user experience across all platforms.

Global lightbox settings

For comprehensive control, you can activate or deactivate the Lightbox globally and customize its design. By default, the Lightbox feature is enabled.

To access the global Lightbox settings:

1. Log in to your 10Web dashboard.
2. Click on the website where you want to access the global settings.
3. Click on AI Builder.
4. Open the editor for any of your pages, Click on the Site Settings icon located on the topbar of the 10Web Builder.
5. Navigate to Settings > Lightbox.

Settings

• Image Lightbox: Toggle to enable/disable Lightbox across the site.
• Counter: Displays an image count in multi-image galleries.
• Fullscreen: Adds an icon to view images in full screen.
• Zoom: Allows visitors to zoom into images within the Lightbox.
• Share: Enables sharing of images on social media or downloading.
• Title & description: Display titles and descriptions with images, customizable with options like None, Title, Caption, Alt, or Description.
• Background & UI colors: Select colors for the Lightbox background and user interface elements, with hover color options too.
• Text color: Customize the color of the text in the Lightbox.
• Toolbar & navigation icons size: Adjust the size of various icons in the Lightbox.

Using image lightbox

The Image Lightbox function automatically applies to any image link leading to a media file. To use it:

1. Drag and drop the Image widget onto your page and choose an image.
2. Click the drop-down menu in front of the Link and choose Media File.
3. Set the Lightbox option to Yes to activate it for the specific image.

Setting the Link to open from the Media File will reflect the global setting of your Lightbox.