Change 500px icon

RollmopsRollmops Big grinsRegistered Users Posts: 10 Big grins
edited January 22, 2016 in SmugMug Customization
I don't like the 500px icon. It has nothing to do with the real icon. It looks like an office clip. Would be great if you could change it into the one being used by 500px itself.:thumb

Comments

  • leftquarkleftquark Former SmugMug Product Team Registered Users, Retired Mod Posts: 3,776 Many Grins
    edited December 12, 2014
    Rollmops wrote: »
    I don't like the 500px icon. It has nothing to do with the real icon. It looks like an office clip. Would be great if you could change it into the one being used by 500px itself.thumb.gif

    Could you provide me a link to your site so I can see what's going on? Without seeing your site though, I imagine you've set your 500px.com link as the "Custom" social link since we don't currently have an option for displaying 500px.com links. If you'd like to request that we add it, head on over to our Feedback Forums (http://feedback.smugmug.com) and let us know.

    With that said, you can change the custom link icon from the paperclip to 500px by using the following code. Place it either in a CSS content block on "Entire Site" or in your theme's custom CSS code:

    For standard 500px icon:
    /* Change the custom link icon to the 500px */
    .sm-fonticon-Link:before {
      content: '\E20A' !important;
    }
    

    For Circular 500px icon:
    /* Change the custom link icon to the 500px */
    .sm-fonticon-LinkCircle:before {
      content: '\E260' !important
    }
    

    For Square 500px icon:
    /* Change the custom link icon to the 500px */
    .sm-fonticon-LinkCircle:before {
      content: '\E25F' !important
    }
    

    Since this is a CSS question at the moment, I'm going to move this thread to the "New SmugMug Customizations" forum.
    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
  • W.W. WebsterW.W. Webster Happily mirrorfree New ZealandRegistered Users Posts: 3,204 Major grins
    edited December 12, 2014
    leftquark wrote: »
    /* Change the custom link icon to the 500px */
    .sm-fonticon-LinkCircle:before {
      content: '\E20A' !important;
    }
    
    I added this to a CSS box for my entire site but nothing changed! ne_nau.gif
  • W.W. WebsterW.W. Webster Happily mirrorfree New ZealandRegistered Users Posts: 3,204 Major grins
    edited December 12, 2014
    Correction - all's well! Thanks! thumb.gif
  • RollmopsRollmops Big grins Registered Users Posts: 10 Big grins
    edited December 13, 2014
    Thanks for your help. It worked perfectly. My site: http://www.carlokoller.com
  • leftquarkleftquark Former SmugMug Product Team Registered Users, Retired Mod Posts: 3,776 Many Grins
    edited December 19, 2014
    Wahoo! Glad it worked :)
    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
  • morgo1968morgo1968 Beginner grinner Registered Users Posts: 9 Big grins
    edited January 3, 2015
    Perfect
    Just what I needed. Thanks heaps.
  • dragandjordjevicdragandjordjevic just a guy with a camera Novi Sad, SerbiaRegistered Users Posts: 188 Major grins
    edited January 3, 2015
    And it works just fine. Awesome, cheers guys! Thanks for the mail info :)
  • zwinterszwinters Adventure Photo Dude Registered Users Posts: 2 Beginner grinner
    edited January 22, 2016
    Hmmm... I tried pasting this CSS code into a CSS block on "all pages". I also tried pasting it into the CSS section of my "theme". No luck! What am I doing wrong? Does this trick no longer work? Thank you!
    www.zacharywintersphotography.com
  • zwinterszwinters Adventure Photo Dude Registered Users Posts: 2 Beginner grinner
    edited January 22, 2016
    Alright, I answered my own question. In case it's useful to anyone else:
    I pasted code for CIRCULAR icons, but my settings showed SQUARE icons. As soon as I changed to circular icons, the new correct 500px icon showed up!
Sign In or Register to comment.