Envira Gallery Blog
Digital Photography Tips, Tutorials and Resources
Digital Photography Tips, Tutorials and Resources
by Waseem Abbas on Jan 12, 2017
Do you want to change the background color for your lightbox photo galleries? Sometimes you want to customize the look to match the design of your website. In this tutorial, we will share how to change lightbox background color in WordPress.
By default, WordPress image galleries don’t have a lightbox feature, so there is no option for changing the background color either. However, you can use an image gallery plugin like Envira to add lightbox photo galleries to your WordPress site and customize them to match your theme.
To change lightbox background color in WordPress, you’ll need to follow these 6 steps:
Ready to get started? Let’s go!
First thing you need to do is install and activate Envira Gallery plugin.
If you need help with this step, then check out our guide on how to install Envira.
Upon activating the plugin, simply go to Envira Gallery » Addons. Look for Gallery Themes Addon to install and activate it.
To access this addon, you must have Envira Plus or higher license. You can learn more about how to upgrade your license in Envira here.
Once the Gallery Themes addon is activated, you can enable lightbox settings for your image gallery.
Next, go to Envira Gallery » Add New. Add a title and drop your photos into the Native Envira Gallery section.
To learn more about creating image galleries with Envira, you may want to check out our guide on how to create an image gallery with thumbnails in WordPress.
Now that you’ve created an image gallery with Envira, go ahead and edit your image gallery. Then, go to the Lightbox tab and check the Enable Lightbox option.
Lightbox is now enabled for your image gallery!
After enabling lightbox for your image gallery, you’ll see some options to change the lightbox background color, image size, navigation, and more.
Simply select your theme: either Base (Dark) or Base (Light). The Base (Dark) theme includes a black lightbox background, and the Base (Light) theme includes a white lightbox background color.
Once you are satisfied with your lightbox background color, simply click on the Publish button.
(If you are editing a pre-built image gallery in Envira, then you should hit the Update button after changing the lightbox theme.)
Now you will see a shortcode in the Envira Gallery Code widget. Go ahead and copy it.
Then, go to Posts » Add New or edit an existing post. In the visual editor, simply paste the shortcode.
Make sure to update the post.
Now you have successfully changed the lightbox background color for your image gallery, and published it on your site!
We hope this tutorial has helped you to learn how to change lightbox background color in WordPress. You may also want to check out our guide on how to create a WordPress image gallery with next and previous buttons.
If you like this tutorial, then please follow us on Facebook and Twitter for more free WordPress tutorials.
Envira Gallery helps photographers create beautiful photo and video galleries in just a few clicks so that they can showcase and sell their work.
So you can change the background color as long as it’s either black or white. Really? What if you want it to be green? Or blue?
Hello Robert,
You can change the background color using an rgba value to allow opacity to be controlled (how light or dark the background color is).
.envirabox-overlay {
background: none !important;
background-color: rgba(0, 153, 0, .5) !important;
}
Simply use this color picking tool to sample the rgba for your background. The last box is for the opacity. Hope this helps! 🙂