Options
CSS code for overlay in new lightbox
sarasphotos
Registered Users Posts: 3,830 Major grins
Namely, I'd love to fix the following in the overlay:
1. get rid of "From "gallery name"
2. Make the Title text slightly smaller
3. Make the Caption area wider so that it doesn't wrap
4. Make the minimum height enough so that the viewer does not need to hover the mouse in order to see the entire content (what viewer would ever think to do that???)
I had this in some former Lightbox version and then it all stopped working so I got rid of all custom CSS.
Any help is appreciated!
Tagged:
0
Comments
Don't understand your first question.
SmugMug is in the process of updating the Lightbox (https://dgrin.com/discussion/265055/upcoming-lightbox-improvements-2019-edition/p1), so you might want to wait until that is done. No idea how long.
Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
Hi Mike, thanks for the reply.
The new lightbox in Organizer really looks pretty good. I will now read the thread in detail to see if my questions are already answered.
Although I have been roughly following the "Lightbox improvements" thread I realize now I need to read it through more carefully. I was thinking the lightbox had already gone live. Dumb me...
Ugh. So sorry to have wasted your time!
@sarasphotos
I took a peek at your site, as it stands at the moment, here is some css that should address those specific areas:
/*** Lightbox Caption Modifications *** Smugocity **********/
/*** Change Lightbox Caption Title Size ***/
.sm-lightbox-v2-photo-buttons .sm-button-label h2 {
font-size: 12px;
}
.sm-lightbox-v2-photo-buttons .sm-button-label h4 {
font-size: 12px;
}
/*** Change Lightbox Caption Text Size ***/
.sm-lightbox-v2-photo-buttons .sm-button-label p {
font-size: 12px;
}
/*** Show More Text In Lightbox Caption ***/
.sm-lightbox-v2-photo-buttons .sm-text-ellipsis p {
white-space: normal !important;
}
/******************** www.smugocity.com ********************/
You can change the font sizes to whatever works best. The title text size varies whether this image is landscape (h2) or portrait (h4).
Give this a spin. At least until things change.