I installed a component that only allows me to put icons in my forum tags through the fontawesome website, but I want to use my own icons, how do I upload them and use them? [image]

Replace Discourse’s default SVG icons with custom icons in a theme

thanks for replying, i was wanting to use this [imagem] Custom Header Links (icons) Theme component discourse2 Summary Custom Header Links (icons) will allow you to easily add linked icons to the Discourse header. eyeglasses Preview Preview on Discourse Theme Creator hammer_and_wrench Repository Link https://github.com/discourse/discourse-icon-header-links open_book New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component Features Screenshots Desktop [Capture3] Mobile [Capture] Settings This component includes a … but for some reason the svg icons i upload on my website i can’t use in that

Oh. I suspect that you’ll need to do a bit of work to make that happen. I changed your title accordingly, so hopefully it’ll get attention from someone who knows more about that theme component. It says [imagem]Custom Header Links (icons) Icon can be any FontAwesome 5 (free) icon name without the fa- ‘fab-’ ‘fas-’ or ‘far-’ parts which I think means that it’s hard or impossible to use other icons.

Adding custom icons is now supported, as of this commit: https://github.com/discourse/discourse-icon-header-links/pull/8 When adding a header link in the theme setting, paste in a url to an icon and it should be present in the header.

Hi! thank you for answering me and for helping me! How do I install this?

Hi @danielabc You simply need to navigate to your components in /admin/customize/themes, find the Icon Header Links component. If it’s not on the latest update, you should see a button to update. [update button] After updating the theme component, in your theme settings where you configure each icon link, simply use a URL to an image source instead of a font awesome icon name. For example, here is how I have a link set up: Desktop mobile link, https://upload.wikimedia.org/wikipedia/commons/thumb/5/53/Pok%C3%A9_Ball_icon.svg/1200px-Pok%C3%A9_Ball_icon.svg.png, https://facebook.com, vdm, self Which renders like so: [sample render]

Como usar meus próprios ícones SVG no componente de tema Custom Header Links?

Suporte ao Produto

pfaffman (Jay Pfaffman) Setembro 6, 2022, 4:55am 2

Substitua os ícones SVG padrão do Discourse por ícones personalizados em um tema

Tópico		Respostas	Visualizações
Custom Header Links (icons) Theme component official , custom-header-icons	117	34147	4 de Agosto de 2025
How to add a link icon to the header Development	3	666	2 de Fevereiro de 2024
Missing custom header link icon after update Product Support	3	1733	5 de Agosto de 2020
Adding icons rather than text UX custom-header-links	2	362	30 de Maio de 2019
Introducing Font Awesome 5 and SVG icons Announcements new-feature	131	45195	1 de Dezembro de 2023

Como usar meus próprios ícones SVG no componente de tema Custom Header Links?

Tópicos relacionados