Share Button Help

ContraGearContraGear Registered Users Posts: 2 Beginner grinner
edited May 26, 2015 in SmugMug Customization
I only have the little share icon on the bottom right of my photos but I'd like the icon with the word share next to it on the bottom left of my photos. I tried adding the css code that smugmug suggested but it did not work. They suggested I try here for possibly a new code that could put the word "Share" next to my little share icon and relocate it to the bottom left instead of the bottom right. Please help, thanx.

Comments

  • annnna8888annnna8888 Registered Users, Super Moderators Posts: 936 SmugMug Employee
    edited May 26, 2015
    Sure, we'll be happy to help, but can you please give us a link to your site? If you could add it to your signature so it's always there when you post, that would be great. Click the clipboard in the upper right > edit signature, and enter the link to your site there, starting with http:// so it's clickable. Thanks!

    Ana
    SmugMug Support Hero
    Ana
    SmugMug Support Hero Manager
    My website: anapogacar.smugmug.com
  • Lille UlvenLille Ulven Registered Users Posts: 567 Major grins
    edited May 26, 2015
    If you want to have the share-text on the right side of your share-button for all galleries add this css in a css-box valid for "all galleries" (if you only need it for one gallery, than use a custom gallery and that custom gallery's css box as well):
    .sm-button.sm-button-image-share:after {
        content: " Share" !important;
        font-size: 95%;
      }
    

    For adding the text to your light boxes additionally add this css to the same css-box:
    .sm-lightbox-icons.sm-button.sm-button-image-share:after {
        content: " Share" !important;
        font-size: 95%;
      }
    

    Both should be within a
    @media only screen and (min-width: 1200px) { /*in here with the css code from above*/ }
    
    to make sure that the text is not shown on too small screens.

    You could - if you want the text for both all galleries and light-boxes - add the code like this:
    @media only screen and (min-width: 1200px) {
    .sm-button.sm-button-image-share:after,
    .sm-lightbox-icons.sm-button.sm-button-image-share:after {
        content: " Share" !important;
        font-size: 95%;
      }
    }
    

    But I haven't figured out yet how to get the button and the text moved to the left side of the screen for my setup...
    The original css-codes that I have used here are, if I remember right, either from leftquark or Sherlock

    Good luck

    Lille Ulven
    https://www.lilleulven.smugmug.com - The Photos of my travels
Sign In or Register to comment.