# Icons neben Kategorien

**URL:** https://meta.discourse.org/t/icons-next-to-categories/287575
**Category:** Support
**Tags:** category-icons
**Created:** [5. Dezember 2023 um 13:21 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575 "2023-12-05T13:21:32Z")
**Posts on this page:** 12
**Page:** 1

<div class="post-metadata">

### Author: ![psybox](https://avatars.discourse-cdn.com/v4/letter/p/b5e925/32.png) [@psybox](https://meta.discourse.org/u/psybox)
#### Post date: [5. Dezember 2023 um 13:21 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/1 "2023-12-05T13:21:32Z")

</div>

Ich habe das Plugin installiert – aber ich sehe keine Möglichkeit, ein Symbol neben einer Kategorie einzufügen. Unter „Kategorien verwalten“ gibt es Bilder – aber keine, die sich auf FA oder SVG beziehen. Ich verwende das Standard-Light-Theme bei einer selbst gehosteten Installation. Ich habe das hier gelesen, was genau das ist, was ich möchte – [Category Icons](https://meta.discourse.org/t/category-icons/104683)

Sicherlich sollte ich eine Kategorie bearbeiten und ein Symbol auswählen oder den Code fa-mug oder was auch immer irgendwo eingeben können?? Ich hoffe, ich übersehe etwas ganz Offensichtliches.

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [5. Dezember 2023 um 13:36 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/2 "2023-12-05T13:36:10Z")

</div>

Hallo, willkommen 👋

Wenn ich das richtig verstehe, haben Sie die [Kategorie-Icons](https://meta.discourse.org/t/category-icons/104683)-Komponente installiert, richtig?

Wenn Sie die Kategorie-Icons-Komponente konfigurieren möchten, gehen Sie zu Admin → Anpassen → Komponenten und wählen Sie sie aus. Die Einstellungen befinden sich dort.

---

<div class="post-metadata">

### Author: ![psybox](https://avatars.discourse-cdn.com/v4/letter/p/b5e925/32.png) [@psybox](https://meta.discourse.org/u/psybox)
#### Post date: [5. Dezember 2023 um 14:11 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/3 "2023-12-05T14:11:10Z")

</div>

Das ist richtig. Ich kann das Fragezeichen-Symbol neben der Kategorie “Allgemein” abrufen – aber sonst nichts. Sie liegen nicht im FA-Format vor – wie kann ich also eine Liste von Symbolen sehen, die ich auswählen kann (zusammen mit ihrem Code)?

Sobald sie im Abschnitt “Symbole” hinzugefügt wurden – was muss dann in den SVG-Teil?

 ![image](https://global.discourse-cdn.com/meta/original/4X/5/6/0/560a8b898977c6e8c2d19b0ac1835ccc7d5bb3f2.png)

Wenn ich zum Beispiel dieses FA-Symbol hinzufügen möchte – wie würden Sie das tun??

> **[Mug Hot Classic Solid Icon | Font Awesome](https://fontawesome.com/icons/mug-hot?f=classic&s=solid)**
>
> Mug Hot icon in the Classic Solid style. Available now in Font Awesome.

Es ist sehr seltsam, dass Sie kein Symbol im entsprechenden Kategoriebereich (wo Sie Bilder zuweisen!) hinzufügen, sondern in einem Theme-Plugin. Aber ich hoffe, das ist nur eine Lernkurve als neuer Benutzer 🙂 Die Dokumentation geht davon aus, dass Sie solche Dinge wissen.

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [5. Dezember 2023 um 14:33 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/4 "2023-12-05T14:33:40Z")

</div>

Sie suchen nach Font Awesome 5-Icons, wie die Beschreibung besagt: [Find the Perfect Icon for Your Project in Font Awesome 5 | Font Awesome](https://fontawesome.com/v5/search?o=r&m=free)

Jedes Icon, das Sie in der Einstellung `category icon list` verwenden, fügen Sie zu `svg_icons` hinzu.  
Zum Beispiel:

 ![image](https://global.discourse-cdn.com/meta/original/4X/7/3/1/7314d11268a57eefbbde1aec86d44c2d04c67343.png)

Was Sie sehen:  
 ![image](https://global.discourse-cdn.com/meta/original/4X/9/5/c/95c1ac715e681c80291625ad24a7c11e99d99f7c.png)

Denken Sie daran, den _Slug_ der Kategorie anzugeben, nicht den vollständigen Namen!  
Sie können den Slug in der URL oder in der Kategorieeinstellung sehen.

> [@psybox](#):
>
> Es ist sehr seltsam, dass Sie kein Icon im entsprechenden Kategoriebereich (wo Sie Bilder zuweisen!) hinzufügen, sondern in einem Themen-Plugin. Aber ich hoffe, das ist nur eine Lernkurve als neuer Benutzer 🙂 Die Dokumentation geht davon aus, dass Sie solche Dinge wissen.

Ich verstehe das vollkommen! Diese Funktionalität ist nicht Teil des Kerns, und eine Möglichkeit, Discourse anzupassen, ist die Installation von Theme-Komponenten. Diese Anleitung könnte Ihnen helfen, es besser zu verstehen:

> [@Beginner's guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966):
>
> This is a crash course in Discourse theme basics. The target audience is everyone who is not familiar with Discourse themes. If you’ve already used Discourse theme / theme components, this guide is probably not something you need to read. What are themes and theme components? A theme or theme component is a set of files packaged together designed to either modify Discourse visually or to add new features. Let’s start with themes. Themes In general, themes are not supposed to be compatible …

---

<div class="post-metadata">

### Author: ![psybox](https://avatars.discourse-cdn.com/v4/letter/p/b5e925/32.png) [@psybox](https://meta.discourse.org/u/psybox)
#### Post date: [5. Dezember 2023 um 14:38 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/5 "2023-12-05T14:38:57Z")

</div>

Danke – das ist sehr hilfreich. Ich werde das ausprobieren und sehen, wie es sich entwickelt! Ich ging davon aus, dass die SVG-Liste FA5 ist und die Icon-Liste integriert ist, da sie nicht erwähnt wird und nicht im FA-Format vorliegt. Wieder ein Lernpunkt!

---

<div class="post-metadata">

### Author: ![psybox](https://avatars.discourse-cdn.com/v4/letter/p/b5e925/32.png) [@psybox](https://meta.discourse.org/u/psybox)
#### Post date: [5. Dezember 2023 um 14:54 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/6 "2023-12-05T14:54:23Z")

</div>

Danke – das hat wunderbar funktioniert, jetzt weiß ich, wie es angewendet wird. Ich werde zweifellos in naher Zukunft viele weitere Fragen haben, geh nicht weg 😉

 ![image](https://global.discourse-cdn.com/meta/original/4X/b/d/2/bd25719c6b999947c5891dd372bf38f540fd0dc6.png)

---

<div class="post-metadata">

### Author: ![Adi1](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/adi1/32/485503_2.png) [@Adi1](https://meta.discourse.org/u/Adi1)
#### Post date: [2. März 2025 um 11:24 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/7 "2025-03-02T11:24:58Z")

</div>

Guten Tag kann anstelle von Standard-Icon-Sets durch [https://simpleicons.org/](https://simpleicons.org/) ersetzt werden?

---

<div class="post-metadata">

### Author: ![Adi1](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/adi1/32/485503_2.png) [@Adi1](https://meta.discourse.org/u/Adi1)
#### Post date: [3. März 2025 um 21:03 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/8 "2025-03-03T21:03:48Z")

</div>

Leute, bitte helft

---

<div class="post-metadata">

### Author: ![tobiaseigen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tobiaseigen/32/539204_2.png) [@tobiaseigen](https://meta.discourse.org/u/tobiaseigen)
#### Post date: [3. März 2025 um 21:14 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/9 "2025-03-03T21:14:06Z")

</div>

Hallo Adi! Willkommen in unserer Community. Es würde anderen helfen, dir helfen zu können, wenn du mehr Details über das Problem, das du hast, und was du mit verschiedenen Symbolen erreichen möchtest, mitteilst. Hast du bereits eine Discourse-Seite eingerichtet, die du gerade konfigurierst? Beziehst du dich überhaupt auf das Kategorie-Icons-Plugin, um das es in diesem Thema geht, oder sprichst du darüber, wie Emojis und Icons in ganz Discourse angezeigt werden?

---

<div class="post-metadata">

### Author: ![Adi1](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/adi1/32/485503_2.png) [@Adi1](https://meta.discourse.org/u/Adi1)
#### Post date: [5. März 2025 um 20:57 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/10 "2025-03-05T20:57:20Z")

</div>

Hallo Tobias Eigen. Standard-Icons funktionieren auf [https://fontawesome.com/](https://fontawesome.com/), aber ich frage mich, wie ich sie über [https://simpleicons.org/](https://simpleicons.org/) zum Laufen bringe, da ich verschiedene Automarken einfügen muss. Könnten Sie mir dabei helfen?

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [5. März 2025 um 22:48 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/11 "2025-03-05T22:48:48Z")

</div>

Das könnte helfen:

> [@Change icon style in discourse](https://meta.discourse.org/t/change-icon-style-in-discourse/355632/2?u=arkshine):
>
> Hey, welcome! Discourse relies only on FontAwesome icons, but there is a way to overwrite default icons with an SVG Spritesheet:

---

<div class="post-metadata">

### Author: ![Adi1](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/adi1/32/485503_2.png) [@Adi1](https://meta.discourse.org/u/Adi1)
#### Post date: [7. März 2025 um 19:41 UTC](https://meta.discourse.org/t/icons-next-to-categories/287575/12 "2025-03-07T19:41:08Z")

</div>

```plaintext
/* Für das linke Menü definieren wir den Hintergrund des Elements mit der Klasse prefix-span innerhalb der Kategorie Audi neu */
.navigation-category [data-category-id="6"] .prefix-span {
  background: url("https://raw.githubusercontent.com/tima4502/car-icons/bb0d0fae3e5b66c512a27a130b219ec0ee342ada/audi.svg") center/contain no-repeat !important;
}

```

Wenn ich auf die Hauptseite klicke, erscheint das quadratische Symbol wieder! Können Sie mir sagen, was ich falsch mache? Und auf der Kategorieseite selbst funktioniert es
