Aide pour remplacer une icône

J’essaie de remplacer l’icône bars pour ouvrir/fermer la barre latérale en suivant ces instructions Replace Discourse's default SVG icons with custom icons in a theme mais je n’ai pas beaucoup de succès.

J’ai créé une spritesheet avec l’icône de barre latérale que je veux utiliser (floutée car c’est une icône pro fontawesome)

J’ai créé un composant et téléchargé la spritesheet :

Et j’ai utilisé ce code (je veux seulement le changement sur ordinateur)

Mais je n’obtiens aucune icône :

Des idées ? Je suis sûr qu’il me manque quelque chose de petit et stupide ! Merci !

Avez-vous essayé avec un nom de fichier d’asset en minuscules (par exemple, npn_spritesheet.svg) ?
parce qu’autrement cela semble fonctionner (je peux le faire facilement avec une icône v5 mais je n’en ai pas de v6 pro).

sauf si c’est simplement à cause de ceci :

Que voyez-vous lorsque vous inspectez l’élément <span class="header-sidebar-toggle"> à gauche du logo de votre site ?

Par exemple, vous n’avez pas de viewbox déclarée sur la balise symbol, l’icône pourrait être juste hors de la vue.

2 « J'aime »

Étrangement, lorsque je supprime cet actif et que je le télécharge à nouveau avec une version en minuscules (je l’ai même renommé en npnassets.svg, je vois toujours l’ancien nom de fichier…

Comme j’ai téléchargé le svg et l’ai inséré manuellement dans la spritesheet, je ne pense pas que cela devrait poser problème, c’est pourquoi j’ai choisi cette voie puisque la v5 n’a pas d’icône de barre latérale.

2 « J'aime »

..vous devrez développer l’élément svg et tous les éléments imbriqués pour voir le code de l’icône.

1 « J'aime »

L’icône du spritesheet n’est donc pas rendue. Vous pourriez toujours essayer de changer l’id de l’icône en un nom sans tiret, comme npnsidebar. Parfois, je rencontre des problèmes avec les noms de variables dans les thèmes dont je ne parviens pas à déterminer la cause réelle, mais un petit ajustement résout le problème.

Sinon, vous pourriez partager le fichier SVG. J’ai vu que vous aviez pixélisé le code réel, mais il sera de toute façon accessible publiquement lorsque vous l’utiliserez sur votre site en direct (edit : ah, je n’avais pas vu que c’était du plan pro…)

1 « J'aime »

Merci, j’ai essayé de changer le nom en npnsidebar dans la feuille de sprites et dans le code, ce qui m’a permis de remplacer correctement la feuille de sprites également. Mais malheureusement, cela n’a pas aidé. Je peux vous envoyer la feuille de sprites et le svg par message privé pour que vous puissiez vérifier mon travail. Merci pour votre aide !

2 « J'aime »

Si vous remplacez l’icône bars par une autre icône de l’ensemble par défaut, le remplacement fonctionne-t-il ? Par exemple, remplacez-la par cog ou comment.

Si cela fonctionne, alors le problème vient de votre code de symbole SVG personnalisé. Il lui manque probablement un attribut viewBox. Comme cette icône personnalisée (pour le composant de thème gifs) :

5 « J'aime »

Je l’ai remplacé de cette façon avec une icône par défaut (l’icône de code) hier et cela a fonctionné, donc je pense que c’est bien l’attribut viewBox comme vous le dites.

4 « J'aime »

C’était tout, merci comme toujours Penar !

4 « J'aime »

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.