Unique icons for each menu item

Hi,

Please allow us having unique icons for each menu item just like the Cwicly List Element.

2 Likes

Not that I’m aware of.
Relative Styling or custom CSS is the way to go here, I guess.

Consider to make this topic a feature request so it can be upvoted :sunglasses:

Converted to feature request. Thanks!

2 Likes

Just a quick message to bring this useful feature into view again. Will be a big timesaver and allow less technical editors to update the menu icons more easily.

@Marius, do you have an example of a recommended approach to this using relative styling?

We have multiple upcoming sites with differing requirements in terms of menu layouts and styles and I want to make sure we are using the best approach (until the mega menu and/or this feature is released), so any recommendations or suggestions will be much appreciated.

1 Like

Just tested a few things out @StrangeTech

I just realized that it might be the case that pseudo elements currently do not support the background-image property.
Targeting the individual menu items via Relative Styling and then adding icons via pseudo elements is the way I had in mind and as far as I’m aware the only potential native no-code solution (without adding functions).

Can you confirm this @Louis?

Thank you for the reply @Marius, much appreciated.

Being able to add background images to the pseudo elements is actually a priority for us. Given the fact that multiple background images are not supported currently, this was the approach we planned to take to add additional positionable background images.

If it is not yet supported I will definitely raise a feature request.

@Louis, when you have a moment, please confirm.

Thanks.

Revisiting this after checking things again @StrangeTech.
It is indeed possible to add background images to pseudo elements.
Any URL is supported, even stuff like SVG’s via data URIs.

Example (with small hiccup):

The actual issue is, that the source tab is missing inside the Relative Styling panel, unless I miss something.
Seems a bit odd, as the sizing & positioning tab is available.

image

Yes, we noticed the same thing. We managed to do what we needed to up until now with just the main background on multiple elements, but it will be very useful to have it present in the relative styles for more complex designs.