To SmugMug developers: I truly do not understand why SmugMug wouldn't allow a simple option to display captions without first having to click a 'Photo Details' button. Such a simple, basic thing.
It's been TWO AND A HALF YEARS and still no solution, after numerous attempts with various CSS patches and much time wasted going back and forth with them.
I truly do not understand SmugMug's thinking. So simple: Just allow Lightbox to show captions without extra clicks.
@blouie said:
To SmugMug developers: I truly do not understand why SmugMug wouldn't allow a simple option to display captions without first having to click a 'Photo Details' button. Such a simple, basic thing.
It's been TWO AND A HALF YEARS and still no solution, after numerous attempts with various CSS patches and much time wasted going back and forth with them.
I truly do not understand SmugMug's thinking. So simple: Just allow Lightbox to show captions without extra clicks.
I'm confused, because Lightbox does show title and caption without having to do extra clicks.
I'm no longer at SmugMug but when I was, I led the development of the new Lightbox. We ran a number of user studies, first observing how your viewers browsed your photos, where they focused their attention, and how much they recalled captions. Designs where the full caption and the photo were on the screen at the same time had significantly lower recall for the caption and lower aesthetic scores. Meaning when the viewer was presented with the full caption and photo, your viewers did not remember the caption and they didn't enjoy your photos as much. As we dove into why, it turned out that your viewers want to do 1 thing at a time: they either want to see the photo and enjoy it, or they want to read about it and learn the story. They don't do both very well at the same time. When we tested designs like the current one, your viewers rated the same photos as looking nicer, and remembered more of the caption.
What are you trying to accomplish with showing the caption without extra clicks? Is it that you want your viewers to read the caption and remember it? If so, the current design is what you want.
@leftquark said:
What are you trying to accomplish with showing the caption without extra clicks? Is it that you want your viewers to read the caption and remember it? If so, the current design is what you want.
I've said it probably at least a dozen times already combined from this thread and emails to support:
I just want Lightbox to be the way it was before the "New" Lightbox. I simply want the caption to appear outside the image, just to the lower left of the image. And without the visitor having to click 'Photo Details' to do it - simply the way it used to be before "New" Lightbox.
My captions are simply the image number in the gallery. I want visitors (especially publication editors and my critique fiends) to be able to jot down image numbers of photos that interest them or that they want to discuss with me. That has nothing to do with any SmugMug survey of what SmugMug says "MY" viewers want. I know what I want; I don't need someone else's survey for that.
Since SmugMug changed Lightbox, I am saying that I should have an option to "Show captions in lower left persistently" or at least finally tell me CSS code that actually works to do that.
Actually, all together, to restore my Lightbox to what it was before "New" Lightbox:
Show captions without having to click 'Photo Detail's. And, if possible, allow it display immediately to the left of the image, and not all the way out to the edge of the page.
Delete the 'Photo Details' button. If I have captions displayed, I don't need another button of clutter on the page. Moreover, I don't need that purple ribbon that appears on the left of the button
Would be nice also to move the back/forward arrows closer to the image (though would have to see what that does on mobile; still SmugMug has no mobile customization whatsoever, except CSS that doesn't accomplish much on mobile anyway).
PS. Because my images all have a white canvass, it would be okay, even better, if the caption appeared in the lower left of the image (in the white canvas).
You can see it here on a Slideshow page I used to use (before the SmugMug oversharpening defect in Slideshow took hold around May of this year thus causing me to rely on Lightbox instead):
@blouie said:
I've said it probably at least a dozen times already combined from this thread and emails to support:
I just want Lightbox to be the way it was before the "New" Lightbox. I simply want the caption to appear outside the image, just to the lower left of the image. And without the visitor having to click 'Photo Details' to do it - simply the way it used to be before "New" Lightbox.
My captions are simply the image number in the gallery. I want visitors (especially publication editors and my critique fiends) to be able to jot down image numbers of photos that interest them or that they want to discuss with me.
You said you "truly do not understand SmugMug thinking". I was explaining it to you since you asked. It's not going back to the old way because for 99.9% of SmugMug photographers, the new Lightbox is a huge improvement. There's also the data -- SmugMug Pro's are making more money as a result -- so you want them to go back to how it was and hurt peoples businesses? Not going to happen.
But even still, SmugMug did exactly what you want and my hunch is your custom CSS has butchered their programming. As a result of your mucking, you think it can't do what you want. You blame them for not doing something but they brought it to you years ago. I just showed you a screenshot where the caption is in the lower left without having to first click on anything. It's there as soon as your visitor clicks on the photo. You could have exactly what you're asking for, without having to do any custom CSS. But I think you're just looking for someone to blame.
Fair enough about explaining SmugMug's survey. I just wish that I had been asked.
No, I did not say that it should go back to the old Lightbox. I am only saying that it would make sense for SmugMug to offer users an option in the settings to show persistent captions without clicking 'Photo Details'.
The CSS I placed on my site all came from instructions from either SmugMug suport or Dgrin experts (as SmugMug itself advised me to go to Dgrin for additional help).
And please do not make this personal by making a psychological claim about me that I am "just looking for someone to blame". On the contrary. What I want is to make my website behave correctly. I can't be blamed for the frustration of having been given CSS by SmugMug and Dgrin that hasn't worked, and even as I have gone back to disable certain of that CSS has I have been advised on Dgrin. I did everything in my power to conscientiously implement every suggestion from SmugMug and Dgrin (as SmugMug support referred me to).
Moreover, the CSS that I got from SmugMug and Dgrin did not "butcher" an otherwise working programming, since from the start of new Lightbox I have never been told how to have what I require. Indeed, if I recall correctly, I was even told that what I require is simply not possible, even with CSS. Then subsequently other workarounds have been offered at Dgrin, as I attempted every one of them.
So, if there is a way to implement my request, I very much welcome being told what it is. Today I tried yet another suggestion (including disabling previous CSS) but it doesn't work.
I appreciate you expertise and help, and I welcome being instructed on how to achieve my requirements, but please don't turn it around to claim that I "mucked" anything up or that I have a "blaming" mentality.
Fair enough that citing the survey goes toward explaining SmugMug's thinking.
I did not mean that Lightbox should altogether revert. I only mean that users should be given an option "show captions persistently without having to click Photo Details" and so that the caption would appear to the left of the image - and whatever other options to have Lightbox work as it used to. If many users like the new Lightbox, of course I don't want to take that away from them. I just want an option to make it work as I would like for myself, which, as I have said, is such an utterly basically simple design choice
I did not "muck up" or "butcher" anything. I put in CSS every time at the advice of SmugMug support and Dgrin experts (as support referred me to Dgrin). I was conscientious at every point to put in only CSS in an exact way as I had been advised to do.
I asked at the very beginning of new Lightbox. If the programming was working so that I could have as I requested, it had never been told to me what do with that programming other than adding the CSS I was advised to add. Moreover, if I recall correctly, finally after different CSS attempts, I was told that what I want is simply not possible with new Lightbox. Later, more Dgrin suggestions came in, and I faithfully tried every one of them exactly as suggested, including right up to today.
Please do not turn this against me personally by making a psychological claim that I only want to "blame". On the contrary. What I want is to make my site work correctly. I should not be faulted for frustration in my taking so much time faithfully implementing every suggestion given to me only for nothing to work.
I appreciate your expertise and your contributions, but it is not correct to say that I "mucked up" anything or that I'm exercising a supposed need to blame.
That said, if anyone can tell me what to do to have the site work as I want, then I would sincerely appreciate that help with thanks in advance (for that matter, I sincerely appreciate the suggestions given me by Hikin' Mike and others, even though they've not worked so far, and I certainly do not blame them whatsoever for their generous advice).
@blouie said:
That said, if anyone can tell me what to do to have the site work as I want, then I would sincerely appreciate that help with thanks in advance (for that matter, I sincerely appreciate the suggestions given me by Hikin' Mike and others, even though they've not worked so far, and I certainly do not blame them whatsoever for their generous advice).
In the impossible to find "Lightbox" settings (start on a Gallery -> Customize -> Content tab, look for the "Lightbox" option, click the wrench). Make sure the Caption field is turned ON.
In your CSS, make sure you don't have anything that might be impacting the LB captions like sm-lightbox-v2-photo-title-and-caption or sm-text-ellipsis, especially anything that might hide the Lightbox captions. I'm hoping it's just the step above, turning LB captions on, which will place them in the lower left corner.
Once enabled, your white borders might make it hard to see the image number, but we can help with some CSS to change font colors or position if that's a problem.
I should have mentioned also that once I get captions showing persistently, I want also to hide the 'Photo Detail's button. (I don't recall whether I had been told a while ago how to do that, but I've left it visible as it is the only way presently to show captions.)
@hadron said:
I'm a Pro SM user. This CSS in my Homepage CSS does not work. Should it?
I'm trying to get the complete Captions always showing Under the photo, and remove the PhotoDetails button.
Looks like SM changed some code since last year. If you want to always show the captions and remove photo details, this should do it. Add it to your theme's custom CSS section.
/**
* Shows Captions All The Time and Removes Details Button
*******************************************************************/
/* Displays Captions All of the Time */
.sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable {opacity: 1;}
/* Removes Details Button */
.sm-user-ui .user-ui-lightbox-details-button {display: none;}
Note: I had each CSS block separted with dash lines underneath, but Dgrin supresses the dashes. (Also, Dgrin deletes posts when I try edit. To do edit, I have to make a completely new post. But that's another matter ...)
@blouie said:
Note: I had each CSS block separted with dash lines underneath, but Dgrin supresses the dashes. (Also, Dgrin deletes posts when I try edit. To do edit, I have to make a completely new post. But that's another matter ...)
I don't know what you mean by Gallery not SmugMug.
I copied from the CSS blocks in my SmugMjug customization. The code there is correct, and it shows correctly in my computer text editor, and it shows correctly in the Dgrin post composition window. But after I've posted, Dgrin fails to display certain characters.
@blouie said:
I don't know what you mean by Gallery not SmugMug.
I copied from the CSS blocks in my SmugMjug customization. The code there is correct, and it shows correctly in my computer text editor, and it shows correctly in the Dgrin post composition window. But after I've posted, Dgrin fails to display certain characters.
Thanks for the updated code.
I meant I copied it from your site/gallery (using webtools) and not what you pasted on the forum. Specifically this:
I don't know what Webtools is (is that the same as Developer Tool in Chrome?).
Yes, what you just posted is how it shows in Dgrin, but it's not what is in my CSS block itself. What is in my CSS block includes the forwardslash character; but when I post to Dgrin, the forwardslash character gets left out.
@blouie said:
I don't know what Webtools is (is that the same as Developer Tool in Chrome?).
Yes, what you just posted is how it shows in Dgrin, but it's not what is in my CSS block itself. What is in my CSS block includes the forwardslash character; but when I post to Dgrin, the forwardslash character gets left out.
My previous post is what is actually in my CSS. It displays properly because I used the "Code" tag in the post composition window. It's when I wasn't using the Code tag that some characters fail to display.
Comments
PS. And I disabled (by commenting out) all other possibly conflicting CSS mentioned previously.
To SmugMug developers: I truly do not understand why SmugMug wouldn't allow a simple option to display captions without first having to click a 'Photo Details' button. Such a simple, basic thing.
It's been TWO AND A HALF YEARS and still no solution, after numerous attempts with various CSS patches and much time wasted going back and forth with them.
I truly do not understand SmugMug's thinking. So simple: Just allow Lightbox to show captions without extra clicks.
I'm confused, because Lightbox does show title and caption without having to do extra clicks.
I'm no longer at SmugMug but when I was, I led the development of the new Lightbox. We ran a number of user studies, first observing how your viewers browsed your photos, where they focused their attention, and how much they recalled captions. Designs where the full caption and the photo were on the screen at the same time had significantly lower recall for the caption and lower aesthetic scores. Meaning when the viewer was presented with the full caption and photo, your viewers did not remember the caption and they didn't enjoy your photos as much. As we dove into why, it turned out that your viewers want to do 1 thing at a time: they either want to see the photo and enjoy it, or they want to read about it and learn the story. They don't do both very well at the same time. When we tested designs like the current one, your viewers rated the same photos as looking nicer, and remembered more of the caption.
What are you trying to accomplish with showing the caption without extra clicks? Is it that you want your viewers to read the caption and remember it? If so, the current design is what you want.
Former SmugMug Product Team
aaron AT aaronmphotography DOT com
Website: http://www.aaronmphotography.com
My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
I've said it probably at least a dozen times already combined from this thread and emails to support:
I just want Lightbox to be the way it was before the "New" Lightbox. I simply want the caption to appear outside the image, just to the lower left of the image. And without the visitor having to click 'Photo Details' to do it - simply the way it used to be before "New" Lightbox.
My captions are simply the image number in the gallery. I want visitors (especially publication editors and my critique fiends) to be able to jot down image numbers of photos that interest them or that they want to discuss with me. That has nothing to do with any SmugMug survey of what SmugMug says "MY" viewers want. I know what I want; I don't need someone else's survey for that.
Since SmugMug changed Lightbox, I am saying that I should have an option to "Show captions in lower left persistently" or at least finally tell me CSS code that actually works to do that.
Actually, all together, to restore my Lightbox to what it was before "New" Lightbox:
Show captions without having to click 'Photo Detail's. And, if possible, allow it display immediately to the left of the image, and not all the way out to the edge of the page.
Delete the 'Photo Details' button. If I have captions displayed, I don't need another button of clutter on the page. Moreover, I don't need that purple ribbon that appears on the left of the button
Would be nice also to move the back/forward arrows closer to the image (though would have to see what that does on mobile; still SmugMug has no mobile customization whatsoever, except CSS that doesn't accomplish much on mobile anyway).
Thank you for your interest.
PS. Because my images all have a white canvass, it would be okay, even better, if the caption appeared in the lower left of the image (in the white canvas).
You can see it here on a Slideshow page I used to use (before the SmugMug oversharpening defect in Slideshow took hold around May of this year thus causing me to rely on Lightbox instead):
https://www.markshapirophoto.com/RiverLakeSlides/n-28PWTs
But that's not crucial; as long as the captions appear either inside in the lower left of the image or outside the image on the left.
You said you "truly do not understand SmugMug thinking". I was explaining it to you since you asked. It's not going back to the old way because for 99.9% of SmugMug photographers, the new Lightbox is a huge improvement. There's also the data -- SmugMug Pro's are making more money as a result -- so you want them to go back to how it was and hurt peoples businesses? Not going to happen.
But even still, SmugMug did exactly what you want and my hunch is your custom CSS has butchered their programming. As a result of your mucking, you think it can't do what you want. You blame them for not doing something but they brought it to you years ago. I just showed you a screenshot where the caption is in the lower left without having to first click on anything. It's there as soon as your visitor clicks on the photo. You could have exactly what you're asking for, without having to do any custom CSS. But I think you're just looking for someone to blame.
Former SmugMug Product Team
aaron AT aaronmphotography DOT com
Website: http://www.aaronmphotography.com
My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
Fair enough about explaining SmugMug's survey. I just wish that I had been asked.
No, I did not say that it should go back to the old Lightbox. I am only saying that it would make sense for SmugMug to offer users an option in the settings to show persistent captions without clicking 'Photo Details'.
The CSS I placed on my site all came from instructions from either SmugMug suport or Dgrin experts (as SmugMug itself advised me to go to Dgrin for additional help).
And please do not make this personal by making a psychological claim about me that I am "just looking for someone to blame". On the contrary. What I want is to make my website behave correctly. I can't be blamed for the frustration of having been given CSS by SmugMug and Dgrin that hasn't worked, and even as I have gone back to disable certain of that CSS has I have been advised on Dgrin. I did everything in my power to conscientiously implement every suggestion from SmugMug and Dgrin (as SmugMug support referred me to).
Moreover, the CSS that I got from SmugMug and Dgrin did not "butcher" an otherwise working programming, since from the start of new Lightbox I have never been told how to have what I require. Indeed, if I recall correctly, I was even told that what I require is simply not possible, even with CSS. Then subsequently other workarounds have been offered at Dgrin, as I attempted every one of them.
So, if there is a way to implement my request, I very much welcome being told what it is. Today I tried yet another suggestion (including disabling previous CSS) but it doesn't work.
I appreciate you expertise and help, and I welcome being instructed on how to achieve my requirements, but please don't turn it around to claim that I "mucked" anything up or that I have a "blaming" mentality.
Thanks.
Fair enough that citing the survey goes toward explaining SmugMug's thinking.
I did not mean that Lightbox should altogether revert. I only mean that users should be given an option "show captions persistently without having to click Photo Details" and so that the caption would appear to the left of the image - and whatever other options to have Lightbox work as it used to. If many users like the new Lightbox, of course I don't want to take that away from them. I just want an option to make it work as I would like for myself, which, as I have said, is such an utterly basically simple design choice
I did not "muck up" or "butcher" anything. I put in CSS every time at the advice of SmugMug support and Dgrin experts (as support referred me to Dgrin). I was conscientious at every point to put in only CSS in an exact way as I had been advised to do.
I asked at the very beginning of new Lightbox. If the programming was working so that I could have as I requested, it had never been told to me what do with that programming other than adding the CSS I was advised to add. Moreover, if I recall correctly, finally after different CSS attempts, I was told that what I want is simply not possible with new Lightbox. Later, more Dgrin suggestions came in, and I faithfully tried every one of them exactly as suggested, including right up to today.
Please do not turn this against me personally by making a psychological claim that I only want to "blame". On the contrary. What I want is to make my site work correctly. I should not be faulted for frustration in my taking so much time faithfully implementing every suggestion given to me only for nothing to work.
I appreciate your expertise and your contributions, but it is not correct to say that I "mucked up" anything or that I'm exercising a supposed need to blame.
That said, if anyone can tell me what to do to have the site work as I want, then I would sincerely appreciate that help with thanks in advance (for that matter, I sincerely appreciate the suggestions given me by Hikin' Mike and others, even though they've not worked so far, and I certainly do not blame them whatsoever for their generous advice).
In the impossible to find "Lightbox" settings (start on a Gallery -> Customize -> Content tab, look for the "Lightbox" option, click the wrench). Make sure the Caption field is turned ON.
In your CSS, make sure you don't have anything that might be impacting the LB captions like
sm-lightbox-v2-photo-title-and-captionorsm-text-ellipsis, especially anything that might hide the Lightbox captions. I'm hoping it's just the step above, turning LB captions on, which will place them in the lower left corner.Once enabled, your white borders might make it hard to see the image number, but we can help with some CSS to change font colors or position if that's a problem.
Former SmugMug Product Team
aaron AT aaronmphotography DOT com
Website: http://www.aaronmphotography.com
My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
Thank you for your help.
Caption field is turned On as it always has been.
I'll look for the CSS you mentioned.
I should have mentioned also that once I get captions showing persistently, I want also to hide the 'Photo Detail's button. (I don't recall whether I had been told a while ago how to do that, but I've left it visible as it is the only way presently to show captions.)
Looks like SM changed some code since last year. If you want to always show the captions and remove photo details, this should do it. Add it to your theme's custom CSS section.
/** * Shows Captions All The Time and Removes Details Button *******************************************************************/ /* Displays Captions All of the Time */ .sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable {opacity: 1;} /* Removes Details Button */ .sm-user-ui .user-ui-lightbox-details-button {display: none;}Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
I added it to the theme custom CSS (same place I tried Hikin' Mike's code).
It hides Photo Details button, but doesn't show caption.
Re possible conflicts, here is all the CSS that mentions Lightbox currently on my site:
ENTIRE SITE
.sm-user-ui .sm-lightbox-v2 .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"] {display: none;}
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"],
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_details_button"] {display: none;}
.sm-user-ui .sm-lightbox-v2-hideable {opacity: 1 !important;}
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] {
position: fixed;
bottom: 20px;
left: 20px;
cursor: default;
}
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] p {color: black;}
/Hiding VIEW PHOTO DETAILS button from lightbox 2019 view/
.sm-user-ui .sm-lightbox-v2-photo-buttons {
display: none;
}
.sm-lightbox-v2-sidebar-placeholder .sm-icon-Details,
.sm-lightbox-v2-sidebar-placeholder .sm-muted{
display: none;
}
.sm-user-ui .sm-lightbox-v2-nav-button .sm-icon-NavigateBack.sm-icon,
.sm-user-ui .sm-lightbox-v2-nav-button .sm-icon-NavigateNext.sm-icon {
height: 44px;
width: 44px;
}
.sm-lightbox-v2-sidebar-content .sm-image-metadata {
position: fixed;
bottom: 100px; }
ALL GALLERIES
don't recall why it is commented out:
//
8. Render title and buy button below image on desktop
& tablet landscape viewports.
*/
@media screen and (min-width: 961px) {
.sm-user-ui .sm-lightbox-v2-content {
height: calc(100% - 72px);
}
.sm-user-ui .sm-lightbox-v2-photo-buttons {
padding: 0;
bottom: -60px;
}
.sm-user-ui .sm-lightbox-v2-photo-buttons-scrim {
background: none;
}
}*/
/* Removes "Shadow" */
.sm-user-ui .sm-lightbox-v2-photo-buttons-scrim-dark {background: transparent;}
/* Displays Captions All of the Time */
.sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable {opacity: 1;}
/* Removes Icons */
.sm-user-ui .sm-lightbox-v2-photo-title .sm-icon,
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_details_button"],
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"] {display: none;}
/* Changes Caption Color */
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] p {color: black;}
.sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable {opacity: 1;}
.sm-lightbox-ft-right {display: none;}
.sm-fonticon-Sizes {display:none;}
.sm-lightbox-info-expand {display:none;}
Didn't work. It hides Photo Details, but it doesn't show captions,
Re conflicts, here is all the CSS on my site that mentions Lightbox:
ENTIRE SITE
.sm-user-ui .sm-lightbox-v2 .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"] {display: none;}
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"],
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_details_button"] {display: none;}
.sm-user-ui .sm-lightbox-v2-hideable {opacity: 1 !important;}
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] {
position: fixed;
bottom: 20px;
left: 20px;
cursor: default;
}
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] p {color: black;}
/Hiding VIEW PHOTO DETAILS button from lightbox 2019 view/
.sm-user-ui .sm-lightbox-v2-photo-buttons {
display: none;
}
.sm-lightbox-v2-sidebar-placeholder .sm-icon-Details,
.sm-lightbox-v2-sidebar-placeholder .sm-muted{
display: none;
}
.sm-user-ui .sm-lightbox-v2-nav-button .sm-icon-NavigateBack.sm-icon,
.sm-user-ui .sm-lightbox-v2-nav-button .sm-icon-NavigateNext.sm-icon {
height: 44px;
width: 44px;
}
.sm-lightbox-v2-sidebar-content .sm-image-metadata {
position: fixed;
bottom: 100px; }
ALL GALLERIES
don't recall why it is commented out:
//
8. Render title and buy button below image on desktop
& tablet landscape viewports.
*/
@media screen and (min-width: 961px) {
.sm-user-ui .sm-lightbox-v2-content {
height: calc(100% - 72px);
}
.sm-user-ui .sm-lightbox-v2-photo-buttons {
padding: 0;
bottom: -60px;
}
.sm-user-ui .sm-lightbox-v2-photo-buttons-scrim {
background: none;
}
}*/
/* Removes "Shadow" */
.sm-user-ui .sm-lightbox-v2-photo-buttons-scrim-dark {background: transparent;}
/* Displays Captions All of the Time */
.sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable {opacity: 1;}
/* Removes Icons */
.sm-user-ui .sm-lightbox-v2-photo-title .sm-icon,
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_details_button"],
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"] {display: none;}
/* Changes Caption Color */
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] p {color: black;}
.sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable {opacity: 1;}
.sm-lightbox-ft-right {display: none;}
.sm-fonticon-Sizes {display:none;}
.sm-lightbox-info-expand {display:none;}
It hides Photo Details button but doesn't show captions.
Re conflicts, here is all the CSS I have mentioning Lightroom:
ENTIRE SITE
.sm-user-ui .sm-lightbox-v2 .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"] {display: none;}
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"],
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_details_button"] {display: none;}
.sm-user-ui .sm-lightbox-v2-hideable {opacity: 1 !important;}
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] {
position: fixed;
bottom: 20px;
left: 20px;
cursor: default;
}
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] p {color: black;}
/Hiding VIEW PHOTO DETAILS button from lightbox 2019 view/
.sm-user-ui .sm-lightbox-v2-photo-buttons {
display: none;
}
.sm-lightbox-v2-sidebar-placeholder .sm-icon-Details,
.sm-lightbox-v2-sidebar-placeholder .sm-muted{
display: none;
}
.sm-user-ui .sm-lightbox-v2-nav-button .sm-icon-NavigateBack.sm-icon,
.sm-user-ui .sm-lightbox-v2-nav-button .sm-icon-NavigateNext.sm-icon {
height: 44px;
width: 44px;
}
.sm-lightbox-v2-sidebar-content .sm-image-metadata {
position: fixed;
bottom: 100px; }
ALL GALLERIES
don't recall why it is commented out:
//
8. Render title and buy button below image on desktop
& tablet landscape viewports.
*/
@media screen and (min-width: 961px) {
.sm-user-ui .sm-lightbox-v2-content {
height: calc(100% - 72px);
}
.sm-user-ui .sm-lightbox-v2-photo-buttons {
padding: 0;
bottom: -60px;
}
.sm-user-ui .sm-lightbox-v2-photo-buttons-scrim {
background: none;
}
}*/
/* Removes "Shadow" */
.sm-user-ui .sm-lightbox-v2-photo-buttons-scrim-dark {background: transparent;}
/* Displays Captions All of the Time */
.sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable {opacity: 1;}
/* Removes Icons */
.sm-user-ui .sm-lightbox-v2-photo-title .sm-icon,
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_details_button"],
.sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id="lightbox_fullscreen_button"] {display: none;}
/* Changes Caption Color */
.sm-user-ui .sm-button.sm-button-nochrome[data-elem-id="lightbox_image_title"] p {color: black;}
.sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable {opacity: 1;}
.sm-lightbox-ft-right {display: none;}
.sm-fonticon-Sizes {display:none;}
.sm-lightbox-info-expand {display:none;}
Note: I had each CSS block separted with dash lines underneath, but Dgrin supresses the dashes. (Also, Dgrin deletes posts when I try edit. To do edit, I have to make a completely new post. But that's another matter ...)
Use the code button:
Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
Thanks for that tip.
/
I do see 'photo-title' in one of my codes. I can comment it out, but don't know whether to comment out the comma at the end of the line.
Just noticed several CSS errors you might want to fix.
In your Entire Site, you are missing the
*in the comments:/Hiding VIEW PHOTO DETAILS button from lightbox 2019 view/ .sm-user-ui .sm-lightbox-v2-photo-buttons { display: none; }Should say:
/*Hiding VIEW PHOTO DETAILS button from lightbox 2019 view*/ .sm-user-ui .sm-lightbox-v2-photo-buttons { display: none; }In your Galleries you are missing
/here:* 8. Render title and buy button below image on desktop & tablet landscape viewports. */ @media screen and (min-width: 961px) { .sm-user-ui .sm-lightbox-v2-content { height:calc(100% - 72px) } .sm-user-ui .sm-lightbox-v2-photo-buttons { padding:0; bottom:-60px } .sm-user-ui .sm-lightbox-v2-photo-buttons-scrim { background:0 } }Should be
/* 8. Render title and buy button below image on desktop & tablet landscape viewports. */ @media screen and (min-width: 961px) { .sm-user-ui .sm-lightbox-v2-content { height:calc(100% - 72px) } .sm-user-ui .sm-lightbox-v2-photo-buttons { padding:0; bottom:-60px } .sm-user-ui .sm-lightbox-v2-photo-buttons-scrim { background:0 } }You have a duplicate here:
.sm-user-ui .sm-lightbox-v2[data-hide-ui] .sm-lightbox-v2-hideable { opacity:1 }This code doesn't work because SM changed the code:
.sm-user-ui .sm-lightbox-v2-photo-title .sm-icon, .sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id='lightbox_details_button'], .sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id='lightbox_fullscreen_button'] { display:none }Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
The missing characters are in the actual code. It's just that Dgrin is leaving them out when I post.
.sm-user-ui .sm-lightbox-v2-photo-title .sm-icon, .sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id='lightbox_details_button'], .sm-user-ui .sm-button.sm-button-skin-default.sm-button-nochrome[data-elem-id='lightbox_fullscreen_button'] { display:none }What is the replacement code?
No, I copy/pasted from your Gallery, not SM.
Sorry about that.
/* Removes Details and Fullscreen Button */ .sm-user-ui .user-ui-lightbox-details-button, .sm-user-ui .user-ui-lightbox-fullscreen-button {display: none;}Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
I don't know what you mean by Gallery not SmugMug.
I copied from the CSS blocks in my SmugMjug customization. The code there is correct, and it shows correctly in my computer text editor, and it shows correctly in the Dgrin post composition window. But after I've posted, Dgrin fails to display certain characters.
Thanks for the updated code.
I meant I copied it from your site/gallery (using webtools) and not what you pasted on the forum. Specifically this:
* 8. Render title and buy button below image on desktop & tablet landscape viewports. */ @media screen and (min-width: 961px) { .sm-user-ui .sm-lightbox-v2-content { height:calc(100% - 72px) } .sm-user-ui .sm-lightbox-v2-photo-buttons { padding:0; bottom:-60px } .sm-user-ui .sm-lightbox-v2-photo-buttons-scrim { background:0 } }You missed the first
/:/* 8. Render title and buy button below image on desktop & tablet landscape viewports. */Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
I don't know what Webtools is (is that the same as Developer Tool in Chrome?).
Yes, what you just posted is how it shows in Dgrin, but it's not what is in my CSS block itself. What is in my CSS block includes the forwardslash character; but when I post to Dgrin, the forwardslash character gets left out.
//
8. Render title and buy button below image on desktop
& tablet landscape viewports.
*/
@media screen and (min-width: 961px) {
.sm-user-ui .sm-lightbox-v2-content {
height: calc(100% - 72px);
}
.sm-user-ui .sm-lightbox-v2-photo-buttons {
padding: 0;
bottom: -60px;
}
.sm-user-ui .sm-lightbox-v2-photo-buttons-scrim {
background: none;
}
}*/
The above post is an example. It is not what is in the post composition box before I hit 'Post Comment'. Instead, certain characters fail to display.
/*/* 8. Render title and buy button below image on desktop & tablet landscape viewports. */ @media screen and (min-width: 961px) { .sm-user-ui .sm-lightbox-v2-content { height: calc(100% - 72px); } .sm-user-ui .sm-lightbox-v2-photo-buttons { padding: 0; bottom: -60px; } .sm-user-ui .sm-lightbox-v2-photo-buttons-scrim { background: none; } }*/Yes, webtool from Firefox. This is what I see:
Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
My previous post is what is actually in my CSS. It displays properly because I used the "Code" tag in the post composition window. It's when I wasn't using the Code tag that some characters fail to display.
What shows in Web Tools is not what is in my CSS block. My CSS block is as in my previous post.
That's odd.
Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk