Changing rtMedia Lightbox from black to white

Archives rtMedia
#1

Hi there, just wondering if there might be a white version of the rtMedia Lightbox instead of the default black. The colour doesn’t really work with my site.

I can’t see anything in the rtMedia settings for alternate colours, has anyone changed theirs to white?

#2

Hello @kobrakai75,

Sorry to say but there is not such admin setting available to alter lightbox color. If you wish to change it, you need to add your custom css for the same.

Thank you.

#3

Hi @pranalipatel,

Thanks for the response.

I’ve tried adding custom css to rtMedia css and my child theme css but some of the changes don’t seem to have any effect. Can you provide me with the css code for the lightbox so I can take a look at it?

#4

Add !important to the css you add, and using Google Chrome hit F12 to view the css of the page. Hit the magnifying glass and click an element and that new window will show you the css.

#5

Hi @illusionsglass, thanks for the response.

I’ve tried that, and I have used !important in all my custom css, but nothing changes in the lightbox. The background for example, I’m trying to make it white:

.mfp-content #buddypress .rtm-lightbox-container .rtmedia-single-media-container .rtmedia-single-meta { background: #fff !important; }

I’ve also tried changing a few other things such as the link colours, but it doesn’t work.

#6

Hello @kobrakai75,

Try below sample CSS code by adding it to Custom Css tab under rtMedia admin settings :

.mfp-content #rtmedia-single-media-container .rtmedia-media { background-color: white; }

Thank you.

#7

I did just that. It doesn’t work.

#8

Hello @KarmaTiger,

The above-given custom CSS code will change the background color of lightbox like this:

lightbox-white-bg.png1171×740 307 KB

If this is what you want then please once check the CSS with any default theme of WordPress. It should work.

If this is not what you expected then please specify your requirement again so that we can guide you accordingly. If possible, kindly provide a screenshot.

Thank you.

#9

nope, it didn’t work. I’ve tried adding it to the child theme .css, and to the custom .css window provided by the plugin. The background is still black.

#10

Hello @KarmaTiger,

Could you please share your website URL with a public media uploaded so that we can look into the issue?

Thank you, Pranali

#11

I could, but there’s adult content

#12

@KarmaTiger

You could check the same issue with some of your test website. Apply the same CSS code to change the lightbox. I checked the same style css on my test site and it’s working for me.

Thanks,

#13

still nothing. I’m using the Kleo theme. It’s fairly widely used; perhaps you’ve encountered this issue before with it?

#14

No, haven’t faced this issue with Kleo theme. rtMedia plugin is compatible with Kleo theme and works fine. For any styling related changes, you may consider to contact the theme developer if they have any custom CSS for required changes.

#15

I found the issue. Kleo had a line in it’s CSS marking .mfp-content #buddypress .rtm-lightbox-container .rtmedia-single-meta as #000 and tagged !important for some reason.

I’ve managed to override it in the child CSS

#16

How you fixed it? Can you share code?

#17