Hi, I am wondering if there is a plugin of some sort that allows to have an icon next to a category similar to something like this? I know there is one but I can’t remember the name. [image]

Hi @Glow :wave: No need for a plugin or theme component. Go to the Category Settings via the admin wrench in top right corner of each category you want an image icon for and go to the “images” tab and there you can upload images to appear like in your screenshot. The one you want is the first one “Category Image Logo”. Note that it will also appear the top of the Category page as well.

In common - css of a theme or theme component, you can do this: .category-logo.aspect-image { width: 100px; } Just change the width value to whatever you wish. Can also use percent instead of pixels. I hope this helps :slight_smile:

[image] Lillian : .category-logo.aspect-image { width: 100px; } hmm, im pretty sure there is still a plugin as i remember using such thing, because this looks pretty weird when i scale it down, and doesnt look like it exactly in the picture, but i cant remember the name. [image]

you can use CSS to further customize the image and it’s placement. there is also this one but I’m not sure it’s what you want. [image] Category Icons Theme component warning This theme component is deprecated and should no longer be used. Its features are now in Discourse Core (see: Bringing popular features to Discourse). For private category icon customization, refer to this topic. discourse2 Summary Category Icons allows category badge links to have icons next to the category name. eyeglasses Preview Preview on Discourse Theme Creator hammer_and_wrench Repository Link https://github.com/discourse/discourse-category-icons …

This is a code I wrote before… :root { --category-logo-width: 70px; --category-spacing: 0px; } .desktop-view table.category-list .category-logo.aspect-image { width: var(--category-logo-width); height: calc(var(--category-logo-width) - 45px); margin: 0 5px 0 0; padding: 0; transform: translatey(-35px); } table.category-list .category-logo.aspect-image img{ width: var(--category-logo-width); height: var(--category-logo-width); } .desktop-view .has-logo .category-text-title { margin-left: calc(var(--category-logo-width) + 5px); } .mobile-view .category-title-link { display: flex; } .mobile-view .category-logo.aspect-image { margin: 0 5px 0 0; margin-top: 0 !important; padding: 0; order: -1 } .mobile-view .category-text-title { margin: auto 0; } .desktop-view td.category { margin: var(--category-spacing); } .desktop-view table.category-list { border-collapse: separate; border-spacing: 0 var(--category-spacing); } .desktop-view table.category-list tr { margin: var(--category-spacing); }

Is there a plugin of some sort to have an Icon next to a category?

Product Support

Glow (Glow) August 23, 2023, 10:23pm 3

Thanks! and is there a way to make it so that it is smaller? It is quite oversized

Topic		Replies	Views
How to show category image before category name on listing pages? Product Support	2	741	April 5, 2022
How to display font awesome icons alongside category? Product Support	8	2814	August 20, 2019
Icons next to categories Product Support category-icons	11	1537	March 7, 2025
Add the icons from Category Icons in the Category Banner component Feature category-banners , category-icons	2	349	August 23, 2023
Category logo on all topics within this category Product Support	6	964	May 2, 2020

Is there a plugin of some sort to have an Icon next to a category?

Related topics