How can I move title/caption below image in Lightbox?

colinpurrington

Does anyone have some code that would shrink the photograph and then display the text underneath? My problem is that the caption that appears in the Lightbox is hard to read because it hovers over the watermark. Or, if that is impossible, is there some code that gives a fill color to text box so that watermark is fully obscured? The latter might even be preferable. Alternatively, I guess I could squeeze my watermark into the spot under the buy button ... that's probably the simplest fix.

Below is a screenshot that shows the issue. Here's the photo's URL in case useful. Seems like lots of sites have the same issue.

Hikin' Mike

You can add this to your Theme's Custom CSS Section. This will change the gradient under the Title/Caption:

/**
* Changes the Gradient Opacity
*/
.sm-user-ui .sm-lightbox-v2-photo-buttons-scrim-dark {
  background: linear-gradient( rgba( 0,0,0,0 ) 0, rgba( 0,0,0,1 ) 75% );
}

The default is background: linear-gradient( rgba( 0,0,0,0 ) 0, rgba( 0,0,0,.2 ) 75% );

You can read about linear-gradient here: https://www.w3schools.com/csSref/func_linear-gradient.asp

colinpurrington

Thank you, @Hikin' Mike. I couldn't make it work with the directions you linked to but adding the code to a CSS block for entire site did the trick.

Scott B

but....is it possible to move the text underneath the image ??
I seem to recall reading something on this forum somewhere but cannot loacte now, but I am not sure the question was ever answered ?
Any assistance gratefully received as I want it to display underneath the lightbox like it always used to do.

Hikin' Mike

@Scott B said:
but....is it possible to move the text underneath the image ??
I seem to recall reading something on this forum somewhere but cannot loacte now, but I am not sure the question was ever answered ?
Any assistance gratefully received as I want it to display underneath the lightbox like it always used to do.

His question was answered because he prefered a darker background in the captions.

If you want to move the Title/Captions under the image, then you need #8: https://dgrin.com/discussion/265352/customizing-the-new-lightbox/p1

Scott B

Cheers. Knew I had seen it somewhere. I just have to figure out how to add depth (more lines) to the area now as the caption gets cut off.

Thx again