Customizing the New Lightbox

1234568»

Comments

  • Hikin' MikeHikin' Mike Walkin' like a Penguin! Atwater, CaRegistered Users Posts: 4,952 Major grins
    edited January 21, 2020

    @blouie said:
    As mentioned, my objective is to show captions but not show the Photo Details button. And I've tried the above mentioned code. However, probably other code is interfering. So here is the code I have now that perhaps is the interfering code:

    Remove all 3 and use this:

    /* 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;}
    
  • leftquarkleftquark Former SmugMug Product Team Registered Users, Retired Mod Posts: 3,747 Many Grins

    @camner said:
    That's wonderful! BUT, if "Shop View" is only available to Pro and Portfolio level users, then those of use on the Power plan are going to be SOL, right? Obviously that's a business decision for SM to make, but since Shop View is intended to help Pro and Portfolio level users drive their selling-prints business (and presumably those that use SM primarily as a sales platform are less likely to have captions, let alone prefer to have captions always showing), might SM consider making the option to show captions by default NOT be limited to those with higher level plans?

    Absolutely. This setting wouldn't be something we'd gate on specific plans. One way I could invision it being built is that certain options within that setting (like Shop View) wouldn't be shown if the plan didn't support it. For example, for Power/Basic accounts, the options could be "Details, Share, Comments" while Portfolio/Pro would have an additional "Shop" option.

    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • camnercamner Beginner grinner Registered Users Posts: 95 Big grins

    @leftquark said:

    @camner said:
    That's wonderful! BUT, if "Shop View" is only available to Pro and Portfolio level users, then those of use on the Power plan are going to be SOL, right? Obviously that's a business decision for SM to make, but since Shop View is intended to help Pro and Portfolio level users drive their selling-prints business (and presumably those that use SM primarily as a sales platform are less likely to have captions, let alone prefer to have captions always showing), might SM consider making the option to show captions by default NOT be limited to those with higher level plans?

    Absolutely. This setting wouldn't be something we'd gate on specific plans. One way I could invision it being built is that certain options within that setting (like Shop View) wouldn't be shown if the plan didn't support it. For example, for Power/Basic accounts, the options could be "Details, Share, Comments" while Portfolio/Pro would have an additional "Shop" option.

    Wonderful to hear! Thanks.

  • blouieblouie Austin, TexasRegistered Users Posts: 37 Big grins
    edited January 26, 2020

    @Hikin' Mike said:

    @blouie said:
    As mentioned, my objective is to show captions but not show the Photo Details button. And I've tried the above mentioned code. However, probably other code is interfering. So here is the code I have now that perhaps is the interfering code:

    Remove all 3 and use this:

    ```
    /* 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;}

    Doesn't work. It still displays the Photo Details button. It works in the sense that clicking the Photo Details button then reveals the caption and the captions display, without having to again click Photo Details, throughout the clicking forward. But all I want is no Photo Details button and just the caption.

    I guess I give up. All I wanted was to have it the way it was before the new Lightbox: just the image, the caption, the left and right arrows, and the X close button.

  • The MechanicThe Mechanic NOT A Support Hero Registered Users Posts: 195 Major grins
    edited February 20, 2020

    @blouie It sounds like this is getting a bit confusing. The following links should help to address each thing you want to change one at a time:

    Remove Lightbox Left Sidebar Nav:
    https://smugocity.com/customization-toolbox/smugmug-lightbox-v2/remove-side-nav-bar/

    Remove View Details When No Title/Caption Present:
    https://smugocity.com/customization-toolbox/smugmug-lightbox-v2/remove-view-details/

    Make The Caption Always On Without Mouse Movement:
    https://smugocity.com/customization-toolbox/smugmug-lightbox-v2/static-title-caption-lightbox/

    This should help you address these changes one at a time.

  • Paul (France)Paul (France) Big grins Registered Users Posts: 30 Big grins

    Dear Smugmug and Dgrin-community, I like very much the lightbox lay-out AFTER you click on the "photo details"-symbol (or the cut-off caption): the photo at right, with title, captions and keywords left of the photo. I would like to get that lay-out immediately after my visitors click on a thumbnail in my gallery view. How can I skip the standard lightbox and directly go to the view with the photo details? Thanks for your suggestions, Paul.

  • camnercamner Beginner grinner Registered Users Posts: 95 Big grins

    @Paul (France):
    At the present time what you want is not possible. The SmugMug team has said that they intend to implement this at some point in the future.

  • Paul (France)Paul (France) Big grins Registered Users Posts: 30 Big grins

    Isn't the only thing that is needed some code that says: "click on the photo details symbol"? Can somebody write the code for that command?

  • AllenAllen "tweak 'til it squeaks" St. Louis, MoRegistered Users Posts: 9,821 Major grins

    .> @Paul (France) said:

    Isn't the only thing that is needed some code that says: "click on the photo details symbol"? Can somebody write the code for that command?

    Not sure what you're referring to but.

    Like this? Upper left corner.
    https://www.photosbyat.com/Birds/Missouri-Bird-Photos-A-G/i-Mrg8Z6F/A

    Al - Just a volunteer here having fun
    My Website | My Blog
  • camnercamner Beginner grinner Registered Users Posts: 95 Big grins

    @Allen
    Can you share the CSS that you used to produce this effect?

    (BTW, on my iPad only the first two lines appear...the third line (“on/off”) is missing)

  • AllenAllen "tweak 'til it squeaks" St. Louis, MoRegistered Users Posts: 9,821 Major grins
    edited February 27, 2020

    @camner said:
    @Allen
    Can you share the CSS that you used to produce this effect?

    (BTW, on my iPad only the first two lines appear...the third line (“on/off”) is missing)

    Might try removing "& CAPTION" but line breaks aren't allowed and might not wrap right.
    Maybe "PHOTO INFO On/Off" would wrap better.

    or for only two lines (might also play with height for 3 lines)
    content:" INFO On/Off";
    font-size:90%;

     .sm-user-ui .sm-page-gallery-keyword .sm-lightbox-v2 .sm-lightbox-v2-navbar-primary li:nth-child(3) .sm-button-square:after {
      content:" INFO & CAPTION On/Off";
      font-size:75%;
      background:#222;
      color:#ff0
     }
    
    Al - Just a volunteer here having fun
    My Website | My Blog
  • RonvanderPlasRonvanderPlas NederlandsRegistered Users Posts: 17 Big grins

    Does anyone know the code to get the title/caption displayed on mobile landscape?

    Currently you have to click on the details button which opens an overlay that covers the whole image. The portrait display does show the title/caption fine. I would like to have that in landscape mode too.

  • Paul (France)Paul (France) Big grins Registered Users Posts: 30 Big grins

    @Allen Yes, Allen, that is an acceptable solution. Thanks for the CSS-code. I have no idea where I should put that code. I have no experience with CSS. Can you explain to me where I should put it? And explain it like to a child ;-) Thanks!

  • LaurieWinterNZLaurieWinterNZ New ZealandRegistered Users Posts: 6 Big grins

    @leftquark I would like to add my support to those wanting the Title, Caption and other details to stay permanently visible on the left hand side in lightbox.
    As I am planning on using Collage Landscape layout, this is the only way I can get all of that information to show nicely for each photo. Most of my customers are a little older, and may not realise to click on the caption or the hamburgers to see more.

    I appreciate the various codes I have found reading through these posts but this is the one thing I would really, really like. The option to turn that on and off would satisfy both sides of the coin.

    For me, the reasoning is that I want to include purchasing information in my caption. I live in New Zealand and SmugMug does not have a printer here. It's totally not economical for me as a hobby photographer to ship from other areas of the world, and thus I can not use SmugMug's buy functionality.

Sign In or Register to comment.