Including icons next to menu items on side navigation output

[jeffm5]

Hi all. Low level HTML/CSS coding knowledge and new(ish) to Flare 20. I'm working on online side nav skinned help solution and want the side nav menu tree to match our software products menu which includes numerous icons (.png files) next to the menu item. No need to style them as I have the correct size and color (Using Capture). I want to insert the actual .png and not use Fontawesome, etc as icons are custom. I can't seem to find anything online that explains how do this. Thinking it is somehow done in the skin file but NO idea how to accomplish this. Any detailed and simple (hopefully) explanation is greatly appreciated

Thanks in advance Flare universe...

Jeff

[AlexFox]

Hi Jeff,

This would be utilised using CSS and the ::before pseudo element to override the content property with your image files.

That should give you enough of a head start to find some reading material but let me know if you need any further help.

[AlexFox]

Blocked from editing because the Flare forums are a grumpy old man

Extra context:

This CSS selector would look something like

Code: Select all

li > a[href="path/to/help/topic.htm"]::before

and you'd need one of these for each icon you wish to insert.

[jeffm5]

Thanks AlexFox. Thought it was something like this based on previous research. Mired in other stuff but will do some searching later this week. Appreciate the response.