Custom Icons on Menu (Pro)

[bora_bora]

Hi!
I am trying to add two extra Menu items to my main menu:
https://basis-praevent.de

• I want to use 2 SVG per menu item to imitate the mouse over (like on the main menu)
• they dont need a text next to it, only the SVG icons is enough.

How would I do that?

[ruenel]

Hello @bora_bora,

Thanks for writing in! To accomplish what you want to do, you can do the following steps:
1.) Go to Appearance > Menus and insert the SVG images on each menu item.

2.) You can then go to Cornerstone > Header Builder and create your custom header.

3.) Insert a Navigation Inline element, Menu > Top Links, and make sure to disable the Text and enable the Graphic so that only those SVG will be displayed on each menu item

Kindly let us know how it goes.

[bora_bora]

Hi Ruenel,
thanks for the reply.
So I managed to use PNGs (which is not really ideal).
SVGs were shown in the Cornerstone editor, but the disappeared when I looked at the frontend.

Another thing that isn’t working: Interactivity. I uploaded a Primary and secondary image in the menu item, but when you hover over the item, it doesnt change.

[ruenel]

Hey @bora_bora,

Please also make sure that the Secondary graphic is enabled in Menu > Top Links > Graphic.

Kindly let us know how it goes.

[bora_bora]

thanks, that worked!

[ruenel]

Glad that I could be of assistance @bora_bora!