Category logo on all topics within this category

Support
1

Is it possible to show a category logo on all topics within this category? I speak about “logo small”.
In my case it’s more appropriate to show a logo connected with this topic than a general site logo.
Thanks!

1 Like
2

Do you want the logo to be displayed on a topic itself or also in the topics list?
I guess you can do that using some CSS.
Or editing templates… :thinking:

1 Like
3

You see, here at Discrourse we don’t have logos for categories.
But if they were chosen, they would be here:

image
image1438×781 64.7 KB

and if the category logo was set up, I would like to see it when I open any topic within this category. in this case category logo should move small logo

image
image1339×771 42.8 KB

1 Like
4

How many categories do you have?

If there are a reasonable number of categories, then this can be done through css. Just redefine the logo at the top. Using:

<body class = "category - ***

category-support, for example, in the topic in which we are now.

1 Like
5

I’ll have a fix number of categories - 30.
Not sure what code to add to css. Can you give me more obvious hint? :slight_smile:

1 Like
6

We remove the logo:

img#site-logo {
    display: none;
}

Or maybe this:

.category-support img#site-logo {
    display: none;  
}

1
11023×397 39.3 KB

I added for clarity your photo:

.category-support .title a {
    background-image: url(https://d3bpeqsaub0i6y.cloudfront.net/user_avatar/meta.discourse.org/ed_bobkov/45/177564_2.png);
    width: 35px;
    height: 35px;
    display: block !important;
}

2
21130×405 40.4 KB

You may have to repeat this code 30 times.

I gave an example of how to do this without a component / plugin. You can implement it somehow differently. Although, css for 30 categories does not take up much space.

6 Likes
7

Thanks! That’s working with some changes.
Hint: category name I should take from “Category Slug” in category settings.

Logo sizes may be different:
width: 65px;
height: 50px;
display: block !important;
background-size: cover;

2 Likes