Give your gallery lightbox a clear, on-brand close button by customizing its color and size. This improves visibility and usability against varying image backgrounds and ensures the button renders at full opacity for a consistent experience. In this guide we show you how to style the Divi Gallery module lightbox close button to apply your chosen color and size and verify the result on the front end.
Style the Divi Gallery Lightbox Close Button using Divi Gallery Booster / Divi Booster
This method demonstrates how to style the Divi Gallery module lightbox close button using the Lightbox Close Button font controls provided by both Divi Gallery Booster and Divi Booster. It’s a quick, no-code approach to set a custom color and size and ensures the button renders at full opacity for clear, consistent visibility.
Access the Lightbox Close Button Styling Controls
Open the settings for your Gallery module and switch to the Design tab. Locate the “Lightbox Close Button” area, expand it, and click the color swatch in the Font controls to open the color picker.
Set a Custom Color and Ensure Full Opacity
In the color picker for the Lightbox Close Button, enter the color hex code you want to use (for example, #ff0000 for a bold red) and set the opacity to 100%. Close the picker to apply your changes.
Adjust the Close Button Size
Still in the Lightbox Close Button Font controls, find the Text Size field and set it to your preferred size (such as 50px for a prominent button).
Save and Publish Your Changes
Once you’ve customized the close button, save your Gallery module settings and publish the page to make your changes visible on the live site.
Preview and Confirm Your Lightbox Close Button
Visit your page on the frontend. Open an image in the gallery lightbox and check that the close button appears exactly as you set it—clear, bright, and sized just right (in this example, large and red at 50px with 100% opacity).
Conclusion
Customizing your Divi Gallery lightbox close button is straightforward with either Divi Gallery Booster or Divi Booster. With just a few tweaks, you’ll ensure your close button always matches your site style and is easy for visitors to see and use.
0 Comments