Problema ao usar ícone personalizado com Tag Icons

[kristof_mulier]

Olá @pmusaraj,

Instalei o componente de tema de ícones de tags. Estas são minhas configurações atuais:

Defini três tags associadas a um ícone Font Awesome:

• bug-showstopper associado a skull-crossbone
• bug-major associado a exclamation-triangle
• bug-minor associado a exclamation-circle

Isso funciona perfeitamente. No entanto, ao tentar associar a quarta tag beetle ao meu arquivo SVG enviado beetle-face.svg, infelizmente não funciona.

Como posso associar corretamente meu próprio arquivo SVG a uma tag? Por favor, ajude-me passo a passo. Sou realmente um iniciante aqui no Discourse (comecei hoje) e tenho pouca experiência com tecnologias web.

Muito obrigado

[pmusaraj (Penar Musaraj)]

Olá @kristof_mulier, bem-vindo ao Discourse!

Veja como você pode adicionar um ícone personalizado:

@pmusaraj

Adicionando ícones personalizados

Se você quiser ter mais ícones do que os disponíveis no FontAwesome, pode adicionar seus próprios ícones SVG em um plugin ou tema. Veja este sprite SVG como exemplo de como estruturar seu sprite. (É essencialmente uma lista de elementos <symbol>, cada um com seu próprio ID exclusivo.)

Em temas e componentes: adicione o sprite SVG na pasta /assets e faça referência a ele no about.json usando o nome da variável icons-sprite. Para um sprite chamado my-icons.svg, seu assets.json deve incluir o seguinte:

"assets": {
   "icons-sprite": "/assets/my-icons.svg"
}

Você também pode adicionar o sprite SVG a um tema ou componente via interface. Ao fazer isso, certifique-se de que o nome da variável SCSS esteja definido como icons-sprite. Captura de tela:

Basicamente, você precisa adicionar o ícone SVG a um sprite, atribuir um ID a ele e, em seguida, adicionar o sprite ao tema e definir o nome da variável para icons-sprite. Depois disso, você pode usar o ID do ícone como os IDs dos ícones do FA (e não use o símbolo $).

[kristof_mulier]

Maravilhoso, isso funcionou perfeitamente!
Obrigado @pmusaraj!
Você é incrível