# אייקוני קטגוריות

**URL:** https://meta.discourse.org/t/category-icons/104683
**Category:** Theme component
**Tags:** official, deprecated, category-icons
**Created:** [19 בדצמבר,‏ 2018,‏ 4:22pm UTC](https://meta.discourse.org/t/category-icons/104683 "2018-12-19T16:22:44Z")
**Posts on this page:** 20
**Page:** 7

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [8 בפברואר,‏ 2021,‏ 6:04pm UTC](https://meta.discourse.org/t/category-icons/104683/128 "2021-02-08T18:04:57Z")

</div>

Try this:

```scss
.select-kit .category-badge-icon {
    display: none;
}

```

---

<div class="post-metadata">

### Author: ![Doug\_White](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/doug_white/32/197382_2.png) [@Doug\_White](https://meta.discourse.org/u/Doug_White)
#### Post date: [8 בפברואר,‏ 2021,‏ 8:04pm UTC](https://meta.discourse.org/t/category-icons/104683/129 "2021-02-08T20:04:01Z")

</div>

That did it. Thank you for the help! I think Discourse navigation is fine as-is but for now I have to implement this small feature for these users and hopefully I can remove it at some point in the future. It’s more of a stop gap fix for the moment.

---

<div class="post-metadata">

### Author: ![chris2fr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/chris2fr/32/229505_2.png) [@chris2fr](https://meta.discourse.org/u/chris2fr)
#### Post date: [2 באוגוסט,‏ 2021,‏ 5:41am UTC](https://meta.discourse.org/t/category-icons/104683/135 "2021-08-02T05:41:30Z")

</div>

Hi,

Is it just me, or does this component not recognize name changes in slugs?

I doesn’t seem to recognize category slugs with changed names in my case, not right away anyway.

---

<div class="post-metadata">

### Author: ![AquaL1te](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/aqual1te/32/201966_2.png) [@AquaL1te](https://meta.discourse.org/u/AquaL1te)
#### Post date: [3 באוקטובר,‏ 2021,‏ 3:28pm UTC](https://meta.discourse.org/t/category-icons/104683/136 "2021-10-03T15:28:25Z")

</div>

I use the dark mode component as well.  
[https://github.com/discourse/discourse-color-scheme-toggle.git](https://github.com/discourse/discourse-color-scheme-toggle.git)

So that makes it a bit difficult to use this for the main categories. Because the icon shows up next to the main category. I now use “categoryColor”, which is red. That works for both the dark and light mode on my forum. But then the icon is not visible in the category selection menu. Because it has the same color as it. So there is just a blank space. Is there a way to fix this? Use an alternative color for the category dropdown menu? Because when “categoryColor” is used, the icon is not visible anymore. Would be great to have a white color for the icon there.

---

<div class="post-metadata">

### Author: ![AquaL1te](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/aqual1te/32/201966_2.png) [@AquaL1te](https://meta.discourse.org/u/AquaL1te)
#### Post date: [3 באוקטובר,‏ 2021,‏ 3:52pm UTC](https://meta.discourse.org/t/category-icons/104683/137 "2021-10-03T15:52:50Z")

</div>

Ah, well, `#cfcfcf` works fine in both dark and light mode. Other option is also to use emojis of course 🙂

---

<div class="post-metadata">

### Author: ![alehandrof](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/alehandrof/32/119526_2.png) [@alehandrof](https://meta.discourse.org/u/alehandrof)
#### Post date: [18 באוקטובר,‏ 2021,‏ 2:28pm UTC](https://meta.discourse.org/t/category-icons/104683/138 "2021-10-18T14:28:11Z")

</div>

I’d like to use an icon that is only available with a Font Awesome Pro subscription (specifically [this icon](https://fontawesome.com/v5.15/icons/phone-laptop?style=solid)). How can I do so with this theme component?

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [18 באוקטובר,‏ 2021,‏ 3:25pm UTC](https://meta.discourse.org/t/category-icons/104683/139 "2021-10-18T15:25:40Z")

</div>

You need to first install this plugin:

[FontAwesome Pro icons](https://meta.discourse.org/t/fontawesome-pro-icons/150871)

And then the pro icons should be available for use for you, including for this component.

---

<div class="post-metadata">

### Author: ![alehandrof](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/alehandrof/32/119526_2.png) [@alehandrof](https://meta.discourse.org/u/alehandrof)
#### Post date: [19 באוקטובר,‏ 2021,‏ 10:13am UTC](https://meta.discourse.org/t/category-icons/104683/140 "2021-10-19T10:13:29Z")

</div>

Thank you, Penar, I’ll take a look at this. I’m having some unrelated trouble rebuilding the forum, and haven’t been able to test this out yet.

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [18 בנובמבר,‏ 2021,‏ 11:32pm UTC](https://meta.discourse.org/t/category-icons/104683/141 "2021-11-18T23:32:36Z")

</div>

> [@pmusaraj](#):
>
> Note that this component also lets you override the `category lock icon` used to denote private categories.

I’ve noticed that this only works on Categories, not Sub-categories.

---

<div class="post-metadata">

### Author: ![nathank](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/nathank/32/290039_2.png) [@nathank](https://meta.discourse.org/u/nathank)
#### Post date: [11 בדצמבר,‏ 2021,‏ 7:09pm UTC](https://meta.discourse.org/t/category-icons/104683/142 "2021-12-11T19:09:31Z")

</div>

> [@nathank](#):
>
> I’ve noticed that this only works on Categories, not Sub-categories.

Further to this, it works everywhere _except_ where sub-categories are displayed as boxes above a category list. It works fine as rows above a category list.

For some reason `categoryTitleLink` isn’t being applied to the boxes.

Any idea why this is the case? I suspect that it might be a (small) problem in core.

* * *

_later…_

This has been fixed by the wonderful Discourse team. For some reason you need to remove and re-install this Theme Component for it to work though:

> [@Unable to alter the lock icon in category boxes](https://meta.discourse.org/t/unable-to-alter-the-lock-icon-in-category-boxes/212133/2):
>
> Some of this is in core, and some of it is in the component. These two PRs should fix the issue when merged

---

<div class="post-metadata">

### Author: ![jimkleiber](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jimkleiber/32/121814_2.png) [@jimkleiber](https://meta.discourse.org/u/jimkleiber)
#### Post date: [5 בינואר,‏ 2022,‏ 11:41pm UTC](https://meta.discourse.org/t/category-icons/104683/143 "2022-01-05T23:41:49Z")

</div>

I actually would love if this let me also put emojis instead of just FontAwesome icons. Is this currently possible?

The example is I want to have a Welcome category and I think the 👋🏻 emoji seems to be a more and more standard way to do it.

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [6 בינואר,‏ 2022,‏ 2:52pm UTC](https://meta.discourse.org/t/category-icons/104683/144 "2022-01-06T14:52:16Z")

</div>

You can add an emoji to the category name using your native emoji picker in your OS.

 ![image](https://global.discourse-cdn.com/meta/original/3X/6/c/6c01bfdfb1db2e900dc64af3e2a4dd62cacaf7f9.jpeg)

---

<div class="post-metadata">

### Author: ![jimkleiber](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jimkleiber/32/121814_2.png) [@jimkleiber](https://meta.discourse.org/u/jimkleiber)
#### Post date: [6 בינואר,‏ 2022,‏ 4:28pm UTC](https://meta.discourse.org/t/category-icons/104683/145 "2022-01-06T16:28:53Z")

</div>

Ah, that seems simple enough ☺ Thank you!

---

<div class="post-metadata">

### Author: ![Alon1116](https://avatars.discourse-cdn.com/v4/letter/a/9de053/32.png) [@Alon1116](https://meta.discourse.org/u/Alon1116)
#### Post date: [24 בינואר,‏ 2022,‏ 10:55am UTC](https://meta.discourse.org/t/category-icons/104683/146 "2022-01-24T10:55:30Z")

</div>

Where to set it? Modify the code or function toggle switch

---

<div class="post-metadata">

### Author: ![Heliosurge](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/heliosurge/32/571810_2.png) [@Heliosurge](https://meta.discourse.org/u/Heliosurge)
#### Post date: [26 בינואר,‏ 2022,‏ 1:44am UTC](https://meta.discourse.org/t/category-icons/104683/147 "2022-01-26T01:44:18Z")

</div>

Would it be possible to use uploaded pics with url link?

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [27 בינואר,‏ 2022,‏ 6:30pm UTC](https://meta.discourse.org/t/category-icons/104683/148 "2022-01-27T18:30:04Z")

</div>

No, I don’t think so.

---

<div class="post-metadata">

### Author: ![craigconstantine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/craigconstantine/32/511195_2.png) [@craigconstantine](https://meta.discourse.org/u/craigconstantine)
#### Post date: [12 בפברואר,‏ 2022,‏ 3:05pm UTC](https://meta.discourse.org/t/category-icons/104683/149 "2022-02-12T15:05:51Z")

</div>

I’ve specified a Font Awesome icon to replace the default padlock icon. Curiously, it appears to be smaller than the other icons… Makes for wonky alignment of the text (in addition to the icon itself being extra-tiny) in category dropdowns and in the ≡ menu’s category listing…

 ![Screen Shot 2022-02-12 at 10.02.58](https://global.discourse-cdn.com/meta/original/3X/a/d/adadc88e530fce93ea98cbb899fe44369b66b653.png)

 ![Screen Shot 2022-02-12 at 10.04.15](https://global.discourse-cdn.com/meta/original/3X/7/1/71d3e923a728cab10b4a7d6cc646c42e86901d4f.png)

---

<div class="post-metadata">

### Author: ![f1r4s](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/f1r4s/32/245347_2.png) [@f1r4s](https://meta.discourse.org/u/f1r4s)
#### Post date: [13 בפברואר,‏ 2022,‏ 10:25am UTC](https://meta.discourse.org/t/category-icons/104683/150 "2022-02-13T10:25:37Z")

</div>

How can i change the color for this from orange to blue ?

 ![Screenshot at 2022-02-13 14-22-33](https://global.discourse-cdn.com/meta/original/3X/5/a/5a6bd768ec16f1759eced203472cbe735e3cb4c5.png)

---

<div class="post-metadata">

### Author: ![craigconstantine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/craigconstantine/32/511195_2.png) [@craigconstantine](https://meta.discourse.org/u/craigconstantine)
#### Post date: [6 במרץ,‏ 2022,‏ 4:33pm UTC](https://meta.discourse.org/t/category-icons/104683/152 "2022-03-06T16:33:42Z")

</div>

Discourse-team gave me a little work-around that can be added to Theme CSS:

```plaintext
// FIX - New lock icon on private categories
svg.fa.d-icon.d-icon-user-plus.svg-icon.svg-string {
    font-size: 1.3em;
    align-self: center;
}

```

---

<div class="post-metadata">

### Author: ![JamesDb](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jamesdb/32/262538_2.png) [@JamesDb](https://meta.discourse.org/u/JamesDb)
#### Post date: [15 ביוני,‏ 2022,‏ 9:22am UTC](https://meta.discourse.org/t/category-icons/104683/153 "2022-06-15T09:22:24Z")

</div>

I’m experiencing a problem where the category slug doesn’t seem to respect hyphens in exact names.  
For example if I have category slugs:

beta-testing  
beta-testing-bugs  
beta-testing-features

Then I add the following theme component entires:

beta-testing,trash-alt,categoryColour  
beta-testing-bugs,trash-alt,categoryColour  
beta-testing-features,trash-alt,categoryColour

Only the first category takes the “trash-alt” icon and the others don’t display any icon  
If I remove the hyphens it seems to work

categories:  
beta-testing  
betatestingbugs  
betatestingfeatures

theme component entries

beta-testing,trash-alt,categoryColour  
betatestingbugs,trash-alt,categoryColour  
betatestingfeatures,trash-alt,categoryColour

This is a work around but it kinda breaks the naming convention for slugs. Am I doing something wrong or is this a bug?

[Previous page](https://meta.discourse.org/t/category-icons/104683.md?page=6)

[Next page](https://meta.discourse.org/t/category-icons/104683.md?page=8)
