Upcoming Lightbox improvements (2019 edition)

Allen

@sarasphotos said:
...
c) Is / will there be a css hack to turn off the line "from galleryxxx" in a smart gallery? I seem to remember there used to be such a thing and for years I had this text turned off.
...

Thanks for mentioning this.
Logged off I now see the "from galleryxxx" in a smart gallery lightbox but not in a gallery photos.
This is absolute great for my passworded family photos because now they can find the source of the photo.
I agree, perhaps a toggle in gallery "Gallery Settings".

Ferguson

Just a comment on the law of unintended consequences....

I bet I have 200 galleries if not more where I have written instructions like "Click on an image to full screen, then on the bottom right there will be a down arrow to download a full resolution copy of the image".

Sigh....I can live with that. I probably should have known better now in the day of responsive web pages to presume a location.

I still am extremely annoyed that just because Leftquark writes book-length captions ( ) the rest of us can't see them in lightbox now. That's what options are for!

hadron

99% of my captions are a single line or shorter.
Get rid of the "VIEW PHOTO DETAILS" icon on top of the photo!
When having the SHOW PHOTO DETAILS option turned OFF, the sidebar is way to wide. It shrinks the photos unacceptably. Make the sidebar have the width and let the caption go to more multiple lines.
All of these changes are bizzare. Who is giving your developers instructions to make these changes??

Verulam

How can we go back to the old lightbox where we can have a slideshow with captions.

Verulam

If the caption field is empty please remove the words “no details available for this photo”

RonvanderPlas

What's the use of showing a message that no details are available if there's no title.

RonvanderPlas

Yeh, both have the same idea. It happens when the previous photo has details and you swipe to the next.

leftquark

@sarasphotos said:
a) I'm pretty dismayed that there is no map - when is it expected to arrive? (or have I just not found it?)

We didn't want to hold up the massive improvements just for the map but we expect to have the map back within the next week or so (and potentially by early next week).

Allen

@leftquark said:

@sarasphotos said:
a) I'm pretty dismayed that there is no map - when is it expected to arrive? (or have I just not found it?)

We didn't want to hold up the massive improvements just for the map but we expect to have the map back within the next week or so (and potentially by early next week).

Any improvements planned? Maybe mouse wheel zoom?

leftquark

@Verulam said:
If the caption field is empty please remove the words “no details available for this photo”

@RonvanderPlas said:
It happens when the previous photo has details and you swipe to the next.

As Ron pointed out, viewers can browse multiple photos once the Lightbox has been opened by clicking next or preview. Some photos in a gallery may have details and some don't and it would be weird if the sidebar closed for photos that didn't, then re-opened for photos that did, so the sidebar stays open with information about their being no details available. If the sidebar was closed and there's no details available, the "Photo Details" button is disabled so they can't launch into a place where it says "No Details Available" -- they should only get to that if they opened the sidebar from a different photo that did have details.

Verulam

OK I can see now that I can keep my simple captions below the photos but I need to change the appearance from SmugMug or Collage to Slideshow which will involve some work but not too much. I get that the detailed photo info is for fuller captions, exif and other metadata.

hadron

If someone has figured out how to make the Font Size larger for the Captions in the Sidebar, please let me know, and include the CSS if that is necessary to do this.
Much appreciated for my old eyes...

Allen

@hadron said:
If someone has figured out how to make the Font Size larger for the Captions in the Sidebar, please let me know, and include the CSS if that is necessary to do this.
Much appreciated for my old eyes...

.sm-user-ui .sm-lightbox-v2 .sm-image-metadata-caption {
    color: #ddd;
    font-size: 14px;     <<< size
    line-height:1.33em;
    text-align:center;
    background: #333;
    padding: 10px 0;
    border: 4px ridge #aaa; 
 /* border: 4px double yellow; */
    border-radius: 12px;}

hadron

Thanks much Allen, and it works for me.
I have seen some of you other CSS in this thread. Do you have public access to your site?
I would love to see what else you have done in your SIDEBAR.

Allen

@hadron said:
Thanks much Allen, and it works for me.
I have seen some of you other CSS in this thread. Do you have public access to your site?
I would love to see what else you have done in your SIDEBAR.

You're welcome.
Here's a sample. I still need to customize the Firefox scroll bar.
https://www.photosbyat.com/Birds/Missouri-Bird-Photos-A-G/i-m7qqRb4/A

hadron

What will happen to the SM app for Android?
It still shows the captions at the bottom of the photo.

hadron

@Jtring said:

.
.
.

/* Narrow the spacing on the detailed image information, closer to what it was before the
most recent change.  This removes the need for scrolling in most cases.*/
.sm-lightbox-v2-sidebar-content .sm-imageinfo-container .sm-imageinfo-label, 
.sm-lightbox-v2-sidebar-content .sm-imageinfo-container .sm-imageinfo-value {
    padding-bottom: 3px;
}

Looking carefully at the photo in this post, there appears a < to the left of the Photo Details section in the side bar.
Is this a way to hide the Photo Details? If so, could you please post the CSS for this.

Allen

Those are the left and right nav arrows.

leftquark

@hadron said:
What will happen to the SM app for Android?
It still shows the captions at the bottom of the photo.

For now they’ll stay with their current design, though we are looking to have consistent design across the platforms. I can imagine a day in which the iOS app, Android app, and web platforms all share a similar design. We’ll let the new design on the web settle and be iterated on before we implement any changes on the apps though

Jtring

@hadron said:

Is this a way to hide the Photo Details? If so, could you please post the CSS for this.

What do you want to hide? All the content in the sidebar, just part of it, the "VIEW PHOTO DETAILS" message that show on top of the image when you close the sidebar, or something else?

hadron

@Jtring said:

@hadron said:

Is this a way to hide the Photo Details? If so, could you please post the CSS for this.

What do you want to hide? All the content in the sidebar, just part of it, the "VIEW PHOTO DETAILS" message that show on top of the image when you close the sidebar, or something else?

All of my users want to always see Captions but never the Photo details, but as site admin I would like to see Photo Details as needed on a per photos basis. I have tried to turn off Photo Details in the Bulk Gallery Settings, but also prevents the site supervisor from seeing the Photo Details.

In the old Lightbox, I turned off the Info button for my guests, but as the site admin I always had access to the photo info. That is what I want to replicate in the new Lightbox.

hadron

@Allen said:

Here's a sample. I still need to customize the Firefox scroll bar.
https://www.photosbyat.com/Birds/Missouri-Bird-Photos-A-G/i-m7qqRb4/A

You and I have very similar likes in the Ligthbox UI. I especially like that you got rid of the Photo Info Icon and replaced it with INFO & CAPTION ON/OFF, you got rid of the Icon View Photo Details which overlays the bottom left on the photo, and the RETURN TO GALLERY button.

If you don't mind sharing the CSS on these mods, I would greatly appreciate this.

I have asked Jtring to see if I can also get rid of the Photo Details for my users/guests, but keep it for the site admin. Like the old lightbox info button. Maybe you have an idea on how to do that...

Allen

@hadron said:

@Allen said:

Here's a sample. I still need to customize the Firefox scroll bar.
https://www.photosbyat.com/Birds/Missouri-Bird-Photos-A-G/i-m7qqRb4/A

You and I have very similar likes in the Ligthbox UI. I especially like that you got rid of the Photo Info Icon and replaced it with INFO & CAPTION ON/OFF, you got rid of the Icon View Photo Details which overlays the bottom left on the photo, and the RETURN TO GALLERY button.

If you don't mind sharing the CSS on these mods, I would greatly appreciate this.

I have asked Jtring to see if I can also get rid of the Photo Details for my users/guests, but keep it for the site admin. Like the old lightbox info button. Maybe you have an idea on how to do that...

Sent you message with my current lighbox CSS.

The download button is only active on my family galleries.

hadron

@Allen said:

Sent you message with my current lighbox CSS.

The download button is only active on my family galleries.

Got it, and many thanks. I will try to understand all of your CSS, and with it, I will probably able to customize it somewhat...

Jtring

@hadron said:

Is this a way to hide the Photo Details? If so, could you please post the CSS for this.

@Jtring said:
What do you want to hide? All the content in the sidebar, just part of it, the "VIEW PHOTO DETAILS" message that show on top of the image when you close the sidebar, or something else?

All of my users want to always see Captions but never the Photo details, but as site admin I would like to see Photo Details as needed on a per photos basis. I have tried to turn off Photo Details in the Bulk Gallery Settings, but also prevents the site supervisor from seeing the Photo Details.

In the old Lightbox, I turned off the Info button for my guests, but as the site admin I always had access to the photo info. That is what I want to replicate in the new Lightbox.

I don't see a way to do that completely, but I can offer a part-way solution. It is possible to hide the photo details for visitors but always have them for yourself when logged in. What's gone, as far as I know, is a way to have them pop up only on demand when logged in. In any case, try this. It's a variation of the code I posted for hiding the SHOW MORE button to visitors. One caveat: I've tried this on a desktop, but I haven't checked to see if this does anything unpleasant on the mobile display. I'm still feeling my way around the new lightbox coding.

/*Removes the CAMERA INFO header and the following information table
and Show More [camera info] button.  Restores these when logged in as owner. */
.sm-lightbox-v2 .sm-lightbox-v2-sidebar-content > h5,
.sm-lightbox-v2 .sm-lightbox-v2-sidebar-content > .sm-imageinfo-container {
    display:none;
}
.sm-user-loggedin.sm-user-owner .sm-lightbox-v2-sidebar-content > h5 {
    display:flex;
}
.sm-user-loggedin.sm-user-owner .sm-lightbox-v2-sidebar-content > .sm-imageinfo-container {
    display:inline-block;
}

hadron

@Allen said:

Sent you message with my current lighbox CSS.

I know the CSS you emailed works on your site, but after pasting it into my CSS, some things are not working.
Hence a few questions (Please take your time answering. None of this is urgent):

1.. If an "x" is at the beginning of a CSS line, does that mean to ignore that line?
2. The Info & Camera On/Off button displays, but acts like the PLAY Slideshow button, and
3. the Photo Details button still shows below the Info & Camera On/Off button.
4. When I click on the Info & Camera O/Off button, it hides all buttons below it, and also hides the BUY and the View Photo details button.
5. Your lightbox does not show the Play Slide show button. Is that disabled via Gallery Settings options?

I wonder if these problems are due to my Gallery Settings.

hadron

@Jtring said:

/*Removes the CAMERA INFO header and the following information table
and Show More [camera info] button.  Restores these when logged in as owner. */
.sm-lightbox-v2 .sm-lightbox-v2-sidebar-content > h5,
.sm-lightbox-v2 .sm-lightbox-v2-sidebar-content > .sm-imageinfo-container {
    display:none;
}
.sm-user-loggedin.sm-user-owner .sm-lightbox-v2-sidebar-content > h5 {
    display:flex;
}
.sm-user-loggedin.sm-user-owner .sm-lightbox-v2-sidebar-content > .sm-imageinfo-container {
    display:inline-block;
}

This works great on the desktop. Mobile is another story, even without your CSS. I had disabled Photo Details in the gallery setting.. Once I did that, when I clicked on photo details on a mobile photo, the photo disappears and only the caption shows on a new mobile screen. Then you have to close the caption screen, go to the next photo, and repeat. This is crazy.

Thanks much for your CSS. It does the job for me.

BigRed

I'm happy with the Lightbox changes. I find that the scaling and the navigation look great, and I was able to easily customize the layout I wanted. I appreciated the advance notice, and the opportunity to experiment with CSS before go-live.

I think my satisfaction is primarily because my personal objective for the Lightbox is simply an optimized view of a single image, with clear and easy navigation. No distractions. Classic. As Smugmug itself puts it: "the window that displays your photo within SmugMug." All of the image data that I choose to display to my visitors -- and all of the tools I need as editor -- are located in the Gallery view (primarily Smugmug style) plus its Info popup.

Just reflecting on this... As with all substantial changes to Smugmug, there are many different opinions because there are so many different ways that people have chosen to personalize SM's functionality. And in this particular case, I daresay the Lightbox has actually become more important for displaying/editing image info as the collage gallery styles have become more popular -- ultimately flipping/mixing the purposes of the gallery and Lightbox views???

hadron

Is there any way (with CSS) to get rid of (not show) the View Photo Details button which overlays the bottom left of the photo?

steamphotos

@hadron said:
Is there any way (with CSS) to get rid of (not show) the View Photo Details button which overlays the bottom left of the photo?

This will remove the icon button but the image title will still be clickable:

.sm-user-ui .sm-lightbox-v2-photo-buttons .sm-icon-Details {
  display: none;
}