kristof_mulier is having trouble attaching a custom SVG icon to a tag using the Tag Icons theme component. They have successfully attached Font Awesome icons to other tags, but their uploaded beetle-face.svg file is not working.
pmusaraj provides a step-by-step solution, explaining that custom icons need to be added to a sprite with a unique ID, and then the sprite needs to be referenced in the theme’s about.json file using the icons-sprite variable. They also provide an example of how to structure the sprite.
kristof_mulier confirms that pmusaraj’s solution worked, and thanks them for their help.
I’ve defined three tags that are attached to a Font Awesome icon:
bug-showstopper attached to skull-crossbone
bug-major attached to exclamation-triangle
bug-minor attached to exclamation-circle
This works just fine. However, I try to attach the fourth tag beetle to my uploaded svg-file beetle-face.svg. Unfortunately, this doesn’t work.
How do I attach my own svg-file to a tag properly? Please help me step-by-step. I’m really a beginner here on discourse (just started today) and I have limited background in web technology.
Thank you very much
Basically, you need to add the SVG icon to a sprite, give it an ID and then add the sprite to the theme and set the var name for it to icons-sprite. Once that’s done, you can use the ID of the icon like the FA icon ids (and don’t use the $ symbol).
