Lightbox customization

jjesp · January 10, 2017

The Lightbox, is a very important feature for showing your photographs. But the possibility for customizing it, is very limited.
At least you should be able to change things like the transition duration on navigation arrow etc.

So my feature request is to have the lightbox much more flexible that it is today.

leftquark · January 11, 2017

This is the exact kind of Feedback we're always looking for. When we added Lightbox Customization options a year and a half ago we took a stab based on the things we were hearing from you all. Since then it's mostly been quiet. Besides setting how long the buttons stay visible, what other customizations are you looking to do?

Lille Ulven · January 11, 2017

What about a possibility of horizontally centering the photo in the lightbox, if it does not fill the entire screen? For example my panoramas lilleulven.com/Portfolios/Panoramaselection/i-Sw2R2Dk have a tendency to be glued to the top of the screen with an empty bottom section. (Blowing them up so that they would fill the entire screen height and be scrollable to see the entire photo's width, instead of shrinking them to the screen width would be a cool option too.)
Another nice customization would be to allow framing of the photo in the lightbox (options: framing Y/N and frame color) – doing it by css had a tendency to work for landscape-format but not for portrait-format.
Arranging the buttons for "Fullscreen" and "Back to Gallery" differently (say Back to Gallery on the left side of the screen and Fullscreen on the right, or below each other) would be a nice one too.

Just a few ideas

Lille Ulven

leftquark · January 11, 2017

@Lille Ulven said:
What about a possibility of horizontally centering the photo in the lightbox, if it does not fill the entire screen? For example my panoramas lilleulven.com/Portfolios/Panoramaselection/i-Sw2R2Dk have a tendency to be glued to the top of the screen with an empty bottom section.

I believe that's a custom CSS thing for your site. On most other SM sites, the photo is always centered:

Lille Ulven · January 11, 2017

@leftquark thanks for the info...now I only have to figure out which of my (kind of endless) customizations caused that...

Allen · January 11, 2017

@Lille Ulven said:
@leftquark thanks for the info...now I only have to figure out which of my (kind of endless) customizations caused that...

I use Web Developer, open the edit CSS window. Then go thru every CSS tab deleting each one watching the site for a change.
click tab > "select all" (cntl-A) > delete (watch page) > Undo (cntl-Z)
go to next tab > repeat
If I find something under to tab I copy all out to text and start pasting back in parts to narrow down the appropriate rule.
This makes it relative easy to find what CSS affects what on page.

Lille Ulven · January 11, 2017

@Allen I use the same, but thanks :-) I actually used that "pointer" on the left and pointed on the lightbox-image to get all css that works with that part of the side and then started narrowing it down, by disabling line for line and changing a few things here and there to test them. That way at least I don't have to go to all my code...until I am in the customizer of my website with its tons of CSS extensions (but found it in the very first one, pretty good for this late in the evening )

And I found it, it was one of my "million" customizations...I had a .sm-lightbox-image { height: 97% !important; } implemented which should have been a .sm-lightbox-image img { height: 97% !important; } to start with, but is anyway completely unnecessary these days. Getting rid of it helped, it seems

Thanks for the hint with the customization, @leftquark it got stuck there at some point (probably even from before I had the first panoramas uploaded) and I always thought it was something that had to be this way...never occurred to me that it could have been one of my old "I want a frame around my photos in Lightbox"-customizations...

jjesp · January 14, 2017

Thank you lefttquark.

Borders would be nice, so that the image has some space from the browser top. And also the navigation arrows. Would be nice to be able to set them up to not be placed the actual image, but outside (like Instagram in a browser).

@leftquark said:
This is the exact kind of Feedback we're always looking for. When we added Lightbox Customization options a year and a half ago we took a stab based on the things we were hearing from you all. Since then it's mostly been quiet. Besides setting how long the buttons stay visible, what other customizations are you looking to do?

Erick L · March 26, 2017

@leftquark said:
Besides setting how long the buttons stay visible, what other customizations are you looking to do?

Not having the arrows cover the photo, especially with those ugly semi-transparent squares would be a good start.

Lightbox customization

Comments