Two good Stack Exchange answers from Raphael at Digital Pianism covering how to add a custom icon to your Magento Admin Menu Items.
In short – these menu items use a custom font character, defined in svg file that’s (somehow? via LESS CSS?) converted to an embedded OpenType font. This custom font uses the Private Use Area of Unicode to define a custom code point for the new font character. The
<li/> of each menu item gets its own CSS class, and that classes uses the
content style to set the unicode character as the
So, high level, if you want to add your own custom icon you need to
- Use a program like IcoMoon to generate an SVG version of the font-character
- Create four other font formats (maybe via generation, maybe on your own
- Add a LESS CSS rule to include your custom font
- Add a LESS CSS rule to add the Unicode character as a
I will not be surprised if many extension developers skip all this and end up jamming an image in there instead.
Also, tell me again how being a developer is blue collar/HVAC type work?