Replace custom social icon with linked in icon

Comments

• Options

  jerryr Registered Users Posts: 595 Major grins

  June 23, 2016 edited June 23, 2016

  Hi Todd - I usually set the social icons to medium size and branded then add the following css.
  The "image path" is the new icon - 40x40 png file.
  
  .sm-page-widget-social-links-link .sm-official .sm-fonticon
  {
  background-image: url("image path");
  height: 40px;
  width: 40px;
  background-repeat: no-repeat;
  background-position: top center;
  color: transparent;
  }
  
  .sm-fonticon-LinkSquare:before {
  display: none;
  }
  
  sm-fonticon-Link:before {
  display: none;
  }
  
  
  .sm-user-ui .sm-page-widget-social-links-link .sm-official .sm-fonticon:before {
  display: none;
  }

  Part-Time Photographer / Web Designer (Site : jrcustomization.com)
  SmugMug Sites - Creative Examples
  Favorite Images and SmugMug Designs

  0
• Options

  tatteberry Registered Users Posts: 35 Big grins

  June 23, 2016 edited June 23, 2016

  Thanks!
  

  jerryr wrote: »

  Hi Todd - I usually set the social icons to medium size and branded then add the following css.
  The "image path" is the new icon - 40x40 png file.
  
  .sm-page-widget-social-links-link .sm-official .sm-fonticon
  {
  background-image: url("image path");
  height: 40px;
  width: 40px;
  background-repeat: no-repeat;
  background-position: top center;
  color: transparent;
  }
  
  .sm-fonticon-LinkSquare:before {
  display: none;
  }
  
  sm-fonticon-Link:before {
  display: none;
  }
  
  
  .sm-user-ui .sm-page-widget-social-links-link .sm-official .sm-fonticon:before {
  display: none;
  }

  Todd Atteberry
  
  The Green Man Design Studio

  0