Custom social icon disappeared

ziggyk

Hi there,

So a couple of weeks ago I've added this code on my CSS Content block to add a custom social icon, as I really disliked the default link icon.

/* Custom Links Custom */

.sm-page-widget-social-links-link .sm-official .sm-fonticon
{
background-image: url("imageURL");
height: 40px;
width: 40px;
background-repeat: no-repeat;
background-position: top center;
color: transparent;
}

.sm-fonticon-LinkSquare:before {
display: none;
}

Everything was working fine until couple of days ago when I checked my site again and the icon just vanished. I'm guessing something was changed in the original smugMug css code.
Is there a fix for that? I've had LinkedIn icon which is pretty important to me.

Also is it possible to have multiple custom social icons? One is just very limiting.

Thanks

leftquark

If you could share a link to your site it'll help us clear this up for ya!

ziggyk

> @leftquark said:
> If you could share a link to your site it'll help us clear this up for ya!

Sure, zygimantaskucas.com

(It didn't let me post a proper link as I'm new to the forum)

leftquark

It looks like your LinkedIn icon is still working. Let me know if you need any additional help

For reference, you can also use our own LinkedIn icons, which are still active, just not used in the social icons. Instead of the code you've used above, you should just be able to use:

For the Regular LinkedIn icon:
/* Change the custom link icon to the Regular LinkedIn */ .sm-fonticon-Link:before { content: '\E269' !important; }

For Circular LinkedIn icon:
/* Change the custom link icon to the circular LinkedIn */ .sm-fonticon-LinkCircle:before { content: '\E268' !important; }

For Square LinkedIn icon:
/* Change the custom link icon to the square LinkedIn */ .sm-fonticon-LinkSquare:before { content: '\E267' !important; }

leftquark

For some reason when we upgraded dgrin, the code didn't come over very well. Here's a re-post.

/* Change the custom link icon to the Regular LinkedIn */
.sm-fonticon-Link:before {
  content: '\E269' !important;
}

For Circular LinkedIn icon:

/* Change the custom link icon to the circular LinkedIn */
.sm-fonticon-LinkCircle:before {
  content: '\E268' !important;
}

For Square LinkedIn icon:

/* Change the custom link icon to the square LinkedIn */
.sm-fonticon-LinkSquare:before {
  content: '\E267' !important;
}