Lightbox Background Color

Hi,

We would like to kindly inform you that the background of Lightbox has been changed by default since the previous updates. Now, it is white.
However, please try to add the following CSS code into Appearance > Customize > Additional CSS:

.spider_popup_wrap {
background-color: rgb(0, 0, 0);
}
.bwg_image_info {
background: rgba(39, 21, 21, 0.7);
}

#bwg_container1_0 #bwg_container2_0 #spider_popup_overlay_0 {
background-color: #0c00003d;
opacity: 10.95;
}

.bwg_ctrl_btn_container {rgb(14, 1, 1); }

Thank you! Have a nice day!

Hi –

Thanks for the CSS. However, the opacity value specified in the third rule is not valid. The value should be between 0 and 1. Perhaps 0.95? Also, there is no property name specified in the fourth rule. Perhaps background-color? And, even with those two corrections, the lightbox is still white. Other suggestions? Thanks!

Hi,

Please try to insert hte following CSS code:

#bwg_container1_0 #bwg_container2_0 #spider_popup_overlay_0 { background-color:#000000;
opacity: 0.70;
}

.spider_popup_wrap {
background-color: rgba(0, 0, 0, 1.00);
}
.bwg_ctrl_btn_container {
background-color: rgba(0, 0, 0, 0.65);
}

.bwg_image_info {
background: rgba(33, 23, 23, 0.7);}

.bwg_toggle_container {
background: none repeat scroll 0 0 #0a0707;}

Please let us know if it helps.

Thank you! Have a nice day!

I’m having the same issue. I inserted the code above into the “Custom CSS” area, and I’m still getting a white background. I checked in a “guest” account through Chrome, as well as a completely different browser, to make sure it wasn’t an issue with the cache.

https://studio142.org/photography/fitness

I’m using the Avant theme.

Any help is appreciated.

• This reply was modified 7 years ago by Blaze Miskulin.

The custom CSS is being overwritten by rules that fall later in the cascade. I finally gave up and just installed the previous version of Photo Gallery, as I needed to move on with my project.

Hi,

@blazemiskulin please try to add the below-written CSS code into Appearance > Customize > Additional CSS:

.spider_popup_wrap {
background-color: #000000;
}
.bwg_ctrl_btn_container,
.bwg_toggle_container,
#spider_popup_left-ico,
#spider_popup_right-ico {
background-color: rgba(84, 84, 84, 0.85);
}
.spider_popup_wrap i {
color: #ffffff;
}

Please let us know if it helps.

Thank you! Have a nice day!

I have the same issue. None of the above work. I just want to change the background color and opacity. it can be easily changed in a browser. check the red color: https://ibb.co/hDLfLH. Please advise.

Hi,

@livakee could you please provide the URL address of the page where the Gallery is published?

Thank you! Have a nice day!

sure, here it is: https://www.onyxcarp.ro/wp/album/

Hi,

Please add the below-written CSS code into Appearance > Customize > Additional CSS:

.spider_popup_overlay,
.bwg_ctrl_btn_container {
background-color: #000000 !important;
}

.spider_popup_wrap {
background-color:rgba(0, 0, 0, 1.00) !important;
}

Let us know if it helped.

Thank you! Have a nice day!

that worked, you’re awesome!!! thanks a lot!

but I still cannot edit the opacity. any suggestions?

The CSS you originally suggested to me did not work. However, the last one you suggested to Livakee *did* work.

Thank you.

Hi,

Please try to add !important at the corner of opacity property, like this:

.spider_popup_wrap {
opacity: 0.5 !important;
}

Thank you! Have a nice day!

thanks man, but that sets up the opacity of the picture. I have added this line in the .spirder_popup_overlay and that’s what I needed. here’s how the complete code look like now:

.spider_popup_overlay,
.bwg_ctrl_btn_container {
background-color: #303030 !important;
opacity: 0.8 !important;
}

.spider_popup_wrap {
background-color:rgba(0, 0, 0, 3.00) !important;
}

Thank you for your kindness

Hi,

Please note that it was just an example to demonstrate how opacity should be written.
However, we are glad that you have come up with the solution.

Thank you! Have a great day!