TOPIC: Icônes svg menus

Hello,
Je suis en train d'essayer de mettre des icones à la place des menus textes, dans mon menu 2, qui est le menu haut droite du site e-commerce en question. Je rencontre un souci au niveau de la qualité. Car avec des icones de 30x30, si je les mets en ce format précis, je perd en qualité. Si je les mets en 50x50 et force la dimension dans le menu (elles sont donc parfaites), parfois sur les navigateurs, elles apparaissent d'abord en taille réelle (donc déforme la mise en page) avant de se mettre en 30x30 si on recharge la page. Ce qui n'est pas viable.

L'option ultime serait de pouvoir mettre mes icones en svg. Je travail avec Illustrator, c'est donc relativement facile pour moi.

Je passe par le menu concerné, puis image de lien de menu pour mettre mes images. Je désactive le texte.

La question est, est-il possible d'utiliser des images svg pour les mettre comme icones de menus ?
J'ai essayé également des les mettre directement en svg comme sélection d'image. Elles s'affichent sur Firefox et Brave, mais pas sur Chrome par exemple.

Bref, je ne sais pas si avec les option de Maximenu, on peut faire quelque chose ou pas ?

Salut
comment tu ajoutes tes icônes ? avec l'interface de Maximenu CK ? ça utilise fontAwesome et il n'y a pas de souci de rendu
je suppose donc que tu passes par des images perso ? pour maximenu tu peux mettre une image SVG, à condition d'arriver à la sélectionner dans le gesionnaire de média
CEd

Oui, je passe par les icone perso.
Mais je préférerais par Fontawesome.
Je vais me pencher sur le sujet. Mais on peut n'avoir que l'icone et pas le texte avec Maximenu ?

Et par Maximenu on peut ajouter une image perso ou tu parles de l’interface native ?

EDIT : En fait je peux sélectionner une image svg directement via Maximenu. Le problème est que Chrome par exemple, n'affiche pas ces images. Donc je pense que le plus simple serait que je puisse utiliser les icones Fontawesome.

J'arrive bien à les afficher via maximenu. Mais je n'arrive pas à désactiver le texte du titre du menu. J'avais tenté un css, qui a bien desactiver le titre, mais du coup aussi les liens du sous-menu...

EDIT 2 : Bon, désolé pur tout ce charabia, mais je m'y perd dans ces icones et ça me prend le choux depuis bientôt une semaine.
Le top pour moi, serait de pouvoir faire fonctionner les images directement, en svg. Comme ça je peux créer celles que je veux.

Problème comme évoqué, Chrome ne les affiche pas (en frontend). Donc j'imagine que je dois faire un truc de travers, car je vois pas pourquoi ça s'affiche sur Firefox, mais pas sur chrome. Voir screenshot.

Ce qui est étrange aussi, c'est que si je colle le chemin de l'image dans mon navigateur, je vois bien l'icone, même sur Chrome ( tango-express.ch/images/icones/user-2.svg )

En backend, elle s'affiche, même sur Chrome.

Je suis conscient que cela n'a peut-être rien à voir avec Maximenu, mais si tu as une idée ou une piste pour que j'arrive à les afficher, je suis preneur.

EDIT 3 :

OK, j'avance un peu. En fait j'arrive à afficher le .svg pour autant que je laisse "Afficher le titre du lien de menu" dans la config du menu.
Si je l'enlève, l'image disparait.

Ce qui n'est pas le cas avec une image .jpg par exemple. Bref.
Il faut maintenant juste pouvoir désactiver l'affichage du titre du premier niveau du lien de menu.

il se peut que ce soit un souci de css, que ton svg n'ai pas de taille intrinsèque qui fait qu'il ne s'affiche pas
car le rendu dans maximenu que ce soit en jpg ou svg est le même

mets l'image svg dans le menu et dis moi que je puisse jeter un oeil

OK, j'ai mis les 3 images (identiques) dans les 3 liens de menu du menu 2

vide le cache de ton navigateur, car chez moi les 3 icones s'affichent aussi bien sur firefox et sur chrome

Oui, je sais, c'est ce que je disais en dernier. Si je met avec l'affichage du titre de menu, ça marche.
Si je désactive l'affichage du titre dans l'option du menu, elles disparaissent. Mais elles ne disparaissent que si ce sont des svg, en jpg, les images restent même sans titre.

Donc comment faire pour masquer le titre et ne garder que l’icône ?
Si j'essaie avec du css display none sur les titreck-title, tout disparait...

c'est un souci de CSS, tu peux le corriger comme cela par exemple

OK, effectivement comme ça ça fonctionne sans les titres.
Donc ça veut dire que c'est ce dont tu me parlais plus haut. L'image svg en question n'a pas de dimension intrinsèque, ce qui fait qu'elle ne s'affiche pas ?

Mais de ce que j'ai lu un peu sur le svg, je devrais pouvoir le définir dans l'image il me semble. Je vais creuser un peu le truc.
Mais bon, si ça fonctionne ainsi.

Merci. Comme ça je peux créé mes icônes sans soucis