[Plugin: Lightbox Gallery] Caption overlapping "Image x/y"

The same problem.

And me –

I had the same issue. Here is what I did and other things you can do to get different designs.

Add the styles below to your stylesheet, this will move the text up a little so that it covers the very bottom edge of the image, with a semi-transparent background and darker text.

#cboxTitle {
    background-color: white;
    bottom: 28px;
    color: #444444;
    opacity: 0.8;
    padding: 4px 0;
}

For a more transparent look, you could make the text color completely black (#000000) and lower the opacity to maybe 0.7 or even 0.6. This also affects the text transparency so any lower starts to make it too hard to read.

If you want to go completely transparent, remove the background-color and opacity setting, and I would suggest adding a white text-shadow, something like “text-shadow: 1px 1px 1px #ffffff;” (adjust the px to get different shadow position and blur).

To put the text across the top instead of the bottom, replace “bottom: 28px;” with “top: 0;” and add “height: 12px;”.

For long text that wraps to two (or more) lines, adjust the bottom position higher or height higher by 16 for each additional line (two lines = 28px), and add “line-height: 14px;”.

You can adjust the height, line-height, and padding to get more or less spacing around the line(s) of text, something like “padding: 6px 0; height: 14px; line-height: 16px;” might look good.

Of course, there might be some differences depending on your theme too, so keep adjusting until you get it like you want.

Hi Web2Guru – many thanks indeed for your help. I have inserted this code and removed the code that was there for the cboxTitle line in the lightbox css file. This has now had the effect of only displaying the image number and not the description or title (e.g. image 19 of 22). Both would be nice (but not on top of one another!) but the title is probably more important. Do you know what I need to change to get this information displaying? Sorry – I’m a bit of a beginner to wordpress so am treading very carefully! Many thanks, Susie
https://www.wiltonwindmill.co.uk/photo-gallery

I did not remove the code from the lightbox css file. It contains additional styles that are needed. The styles I used overwrite or add on to those styles.

In my case, I am not using the image title and description, I have inserted a gallery and have set the captions. So there may be some differences in this case. I will review the title and descriptions later today to see what differences there are.

Thanks Web2Guru – I have reinstated the original code and this works well.

Hello, I am having a problem with the menu text overlapping the image on the gallery.
https://vaearts.org/US/archives/1096
if you click on the first image you will see the items from the main menu show in the center of the image when the gallery pops up.
if anyone can help me solve this problem I would really appreciate it.
many thanks.

@valeriacordero, I do not see the problem. I do not see the main menu and I do not see any caption text. Let us know if you have already fixed it.

If this is not related to the original problem posted here, please start your own topic.

Thank you Web2Guru, i am sorry i didnt mentioned it here. I was able to fix it today by updating the lightbox gallery plugin. many thanks for your time and attention. best.