Ich kann die Benachrichtigungssymbole nicht ändern

[Mikhail_Tyuftyaev]

Hi, everybody
I want to change these icons

I did it like this

And I wrote it in the Header

But the icon has not changed
It works with other icons
Please help me solve this problem

[Don]

Hi Mikhail,

Please try this one

<script type="text/discourse-plugin" version="0.8">
  api.replaceIcon('notification.granted_badge', 'oo-medal-badges');
</script>

You can find these replacements here

discourse/discourse/blob/dc6b547ed89f652b5406489d76140b76cf8e0d1d/app/assets/javascripts/discourse-common/addon/lib/icon-library.js#L13

[Mikhail_Tyuftyaev]

Yes, it worked. Thank you very much

[Mikhail_Tyuftyaev]

And where can I see what they look like?

@Don

const REPLACEMENTS = {
            "d-tracking": "bell",
            "d-muted": "discourse-bell-slash",
            "d-regular": "far-bell",
            "d-watching": "discourse-bell-exclamation",
            "d-watching-first": "discourse-bell-one",
            "d-drop-expanded": "caret-down",
            "d-drop-collapsed": "caret-right",
            "d-unliked": "far-heart",
            "d-liked": "heart",
            "notification.mentioned": "at",

[Don]

You can easily identify it by using inspect elements.

For example.: the certificate icon notification

1. Find the icon name with inspect elements

---

2. Find the same icon in the icon-library js

discourse/discourse/blob/dc6b547ed89f652b5406489d76140b76cf8e0d1d/app/assets/javascripts/discourse-common/addon/lib/icon-library.js#L40

Then you can replace the icon with any other icon you want.

[Mikhail_Tyuftyaev]

Thanks for your reply
I figured it out. I thought there was some sort of list with standard Discourse icons

[kjs-fgx]

Darf ich das für zukünftige Referenz hinzufügen. Ich habe die Anweisungen unter Replace Discourse's default SVG icons with custom icons in a theme - #19 befolgt, aber was mir anfangs nicht bewusst war, ist, dass dasselbe Symbol auf verschiedene Arten referenziert werden kann. In der App selbst, unter „/styleguide/atoms/icons“, gibt es eine Liste aller Symbole und wie sie referenziert werden. In meiner header.html-Datei habe ich jetzt 5 Referenzen auf das Briefumschlag-Symbol:

    api.replaceIcon('envelope', 'fgx-air-mail');
    api.replaceIcon('far-envelope', 'fgx-air-mail');
    api.replaceIcon('notification.private_message', 'fgx-air-mail');
    api.replaceIcon('notification.read_private_message', 'fgx-air-mail');
    api.replaceIcon('notification.invited_to_private_message', 'fgx-air-mail');