Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Thanks for the CSS snippet. Unfortunately I'm not getting the desired results via the CSS custom Salient area. The following code below is getting picked up instead. Perhaps it's related to the order?
But it also didn't work. So, I decided to put it directly in the Page's Custom CSS settings and I've attached an image of what showed up. It looks like there's a conflict ? When I toggle the recommended CSS off then the icons show up (showing the default font-family).
Could you allow us to log in to your website backend dashboard so we can check on this for you more?. We are gonna need the username and password of admin user as well as the login url.
Unfortunately that did not work. I added the following in the Page Custom CSS settings for the homepage and it worked:
body .fa.fa-twitter:before {
content: "\e60c" !important;
}
body .fa.fa-facebook:before {
content: "\e60d" !important;
}
Perhaps there's an issue with our caching plugin and that may be contributing to the reason why the global CSS settings aren't coming through.
This is a decent band aid solution for now, but it does seem like there are 2 different Font Awesome libraries that are conflicting with eachother. I appreciate you helping me figure this out!
Hi there,
I noticed the other day that the Twitter and Facebook icon buttons in our footer are not showing up, although the GMB icon does.
All icons show up on our blog page only (which is also odd).
Please advise on how to adjust this please, thank you!
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.fa.fa-facebook, .fa.fa-twitter { font-family: 'FontAwesome' !important; }Thanks
ThemeNectar Support Team
Hi Tahir,
Thanks for the CSS snippet. Unfortunately I'm not getting the desired results via the CSS custom Salient area. The following code below is getting picked up instead. Perhaps it's related to the order?
.fa.fa-angle-down, .fa.fa-angle-left, .fa.fa-angle-right, .fa.fa-angle-up, .fa.fa-facebook, .fa.fa-twitter, .icon-button-arrow, .icon-salient-cart, .icon-salient-left-arrow, .icon-salient-m-close, .icon-salient-right-arrow { font-family: icomoon !important;
speak:none;
font-style:normal;
font-weight:400;
font-variant:normal;
text-tranform:none;
-webkit-font-smoothing:antialiased;
}
I tried to target it further by doing the following and cleared the cache multiple times as well
But it also didn't work. So, I decided to put it directly in the Page's Custom CSS settings and I've attached an image of what showed up. It looks like there's a conflict ? When I toggle the recommended CSS off then the icons show up (showing the default font-family).
Any ideas ? Thanks for your help!
Hey Again,
Could you allow us to log in to your website backend dashboard so we can check on this for you more?. We are gonna need the username and password of admin user as well as the login url.
Thanks
ThemeNectar Support Team
Added in Additional code , please check now.
i .fa.fa-facebook, i .fa.fa-twitter { font-family: "FontAwesome" !important; } .fa-twitter:before { content: "\f099" !important; } .fa-facebook-f:before, .fa-facebook:before { content: "\f09a" !important; }Thanks
ThemeNectar Support Team
Thanks Tahir,
Unfortunately that did not work. I added the following in the Page Custom CSS settings for the homepage and it worked:
body .fa.fa-twitter:before { content: "\e60c" !important; } body .fa.fa-facebook:before { content: "\e60d" !important; }Perhaps there's an issue with our caching plugin and that may be contributing to the reason why the global CSS settings aren't coming through.
This is a decent band aid solution for now, but it does seem like there are 2 different Font Awesome libraries that are conflicting with eachother. I appreciate you helping me figure this out!