-
Posts
-
I want to use alternative icons on my site, but I don’t want to lose the convenience of designing with X Elements, such as the Feature Box (which contains an icon).
I don’t necessarily need the ability to choose from the convenient menu, but I do want to use the Elements, complete with an icon and icon background (be it the square, rounded, circle, hexagon or badge)… and I still want to have the capability of colouring the icon and its background.
It is my understanding that it is NOT possible to import custom icons into the picker/menu that we can access in the Element inspector panel. Is that right?
However, is it possible to replace the icons (in an Element) using code? I’m hoping yes! And if so, how do I go about it?
The icons I want to use are, in fact, courtesy of FoRt Awesome (Font Awesome’s paid-for service). Specifically, I want to incorporate Google’s Material Design icons set: https://fortawesome.com/sets/material-design
Hi there,
Thanks for writing in! Regretfully, this particular customization request is outside the scope of our support. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer to assist you with this. X is quite extensible with child theme, so there are plenty of possibilities.
Thanks for understanding. Take care!
Hmm… I’m not so sure this is outside the scope? Perhaps that’s due to the fact that I cited another product, which meant I ended up with the stock ‘custom development’ response? So let me rephrase the question…
How can I target X’s default Font Awesome icons—in various Elements—in order to swap them for other icons?
We’re sorry but this really is outside the scope of our support as the custom development required would be quite involved. Font Awesome in X are outputted dynamically and requires modifying Cornerstone’s functions.
Thanks.
Ah, gotcha! Cheers for clarifying, Christian.
I spoke with the FortAwesome guys and they came back with the below. Wondering if there’s any chance you could point me in the right direction?:
“Font Awesome and Fort Awesome work very much the same way and while it may be possible to do what you’re asking it’s going to be a hack at best. What you would be aiming for here if you continue along this path is to get the unicode characters to align. For example if you wanted to replace the “search” icon with the one from MD you could ensure that the name is the same and it has the same unicode value of “f002″. These unicode values can be changed if you edit individual icons in your kit inside of Fort Awesome.”
Any pointers?
Nice one
Hi there,
Thanks for writing back. Yes that’s possible for sure but not usual at all. You will need lots of custom CSS to adjust the positioning if you want to add your own icon image. So it would be really complex to replace the existing integration. But I guess you can just recreate the elements by using the new icons there.
Cheers!
Gotcha! OK, maybe I’ll swerve that complication then. Cheers for the heads up.
You’re welcome.
