# Discourse Category Headers theme component

**URL:** https://meta.discourse.org/t/discourse-category-headers-theme-component/148682
**Category:** Theme component
**Created:** [April 21, 2020, 1:02am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682 "2020-04-21T01:02:59Z")
**Posts on this page:** 20
**Page:** 4

<div class="post-metadata">

### Author: ![digitaldominica](https://avatars.discourse-cdn.com/v4/letter/d/97f17d/32.png) [@digitaldominica](https://meta.discourse.org/u/digitaldominica)
#### Post date: [January 6, 2024, 6:23am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/63 "2024-01-06T06:23:22Z")

</div>

I’m also seeing this warning :

`deprecated.js:54 Deprecation notice: PluginOutlet arguments should now be passed using `@outletArgs=`instead of`@args=` (outlet: category-box-below-each-category) [deprecation id: discourse.plugin-outlet-args]`

Is this from the component or discourse core?

---

<div class="post-metadata">

### Author: ![Rhidian](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhidian/32/176630_2.png) [@Rhidian](https://meta.discourse.org/u/Rhidian)
#### Post date: [January 6, 2024, 8:40am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/64 "2024-01-06T08:40:39Z")

</div>

Thank you. I’ve merged those changes into the master. Has this resolved the issue now?

---

<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: [January 11, 2024, 5:39pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/66 "2024-01-11T17:39:32Z")

</div>

@Rhidian Sorry, there was an overlook in the previous PR. The `.discourse-compatibility` file is misplaced. I made a PR to fix it.

[https://github.com/naidihr/discourse-category-headers/pull/8](https://github.com/naidihr/discourse-category-headers/pull/8)

> [@digitaldominica](#):
>
> Is this from the component or discourse core?

Not in this component.

---

<div class="post-metadata">

### Author: ![Rhidian](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhidian/32/176630_2.png) [@Rhidian](https://meta.discourse.org/u/Rhidian)
#### Post date: [January 11, 2024, 5:42pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/67 "2024-01-11T17:42:20Z")

</div>

Thanks. I’ve merged that change in.

---

<div class="post-metadata">

### Author: ![StefanoCecere](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stefanocecere/32/158064_2.png) [@StefanoCecere](https://meta.discourse.org/u/StefanoCecere)
#### Post date: [July 18, 2024, 6:23am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/68 "2024-07-18T06:23:10Z")

</div>

thank you @Rhidian this component is much better than category-banners and should be the new default! 🙂

---

<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: [July 30, 2024, 5:11am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/69 "2024-07-30T05:11:23Z")

</div>

I’ve done this PR to add compatibility with alternative lock icons (from [Category Icons](https://meta.discourse.org/t/category-icons/104683)):

[https://github.com/naidihr/discourse-category-headers/pull/9](https://github.com/naidihr/discourse-category-headers/pull/9)

> [@StefanoCecere](#):
>
> this component is much better than category-banners and should be the new default!

Totally agree!

---

<div class="post-metadata">

### Author: ![Rhidian](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhidian/32/176630_2.png) [@Rhidian](https://meta.discourse.org/u/Rhidian)
#### Post date: [August 1, 2024, 7:23am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/70 "2024-08-01T07:23:04Z")

</div>

> [@nathank](#):
>
> I’ve done this PR to add compatibility with alternative lock icons

Thanks Nathan 👍. I’ve merged that in. Please test.

---

<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: [August 1, 2024, 9:15am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/71 "2024-08-01T09:15:57Z")

</div>

All good so far, although in hindsight I should have put the settings the other way around!

Will do a super minor PR for that shortly.

---

<div class="post-metadata">

### Author: ![Rhidian](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhidian/32/176630_2.png) [@Rhidian](https://meta.discourse.org/u/Rhidian)
#### Post date: [August 21, 2024, 2:38am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/72 "2024-08-21T02:38:29Z")

</div>

Thanks Nathan. Let me know when that’s done and I’ll merge in. 👍

---

<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: [August 21, 2024, 3:33am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/73 "2024-08-21T03:33:03Z")

</div>

Already done!

[https://github.com/naidihr/discourse-category-headers/pull/10](https://github.com/naidihr/discourse-category-headers/pull/10)

---

<div class="post-metadata">

### Author: ![Rhidian](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhidian/32/176630_2.png) [@Rhidian](https://meta.discourse.org/u/Rhidian)
#### Post date: [August 22, 2024, 6:41am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/74 "2024-08-22T06:41:58Z")

</div>

Updated thanks Nathan 👍

---

<div class="post-metadata">

### Author: ![davidkingham](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/davidkingham/32/119528_2.png) [@davidkingham](https://meta.discourse.org/u/davidkingham)
#### Post date: [October 9, 2024, 11:42pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/75 "2024-10-09T23:42:52Z")

</div>

I know this component is getting a bit old, but I really like it and would love to see a tiny improvement that would also help with some of the original requests as well.

Showing just the first paragraph is fine, but I would love to have a “Read more…” link which is linked to the category description. A very elegant solution to have a lengthy description without cluttering up the category’s page. I can add this link manually, but then it shows on the Categories page which isn’t very clean.

---

<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: [October 10, 2024, 1:55am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/76 "2024-10-10T01:55:07Z")

</div>

I think that this is a brilliant idea! I’ve often thought that the remainder of the description topic was unnecessarily buried in the UI once it had been unpinned. And before it is unpinned, the first paragraph is total duplication. This is (in my mind) a much better approach.

I can see where the code would need to be inserted - and had a crack at it. However, my skills are simply too meagre for me to work out how to get the topic\_id of the category description topic.

@Rhidian - can you help?

> [@davidkingham](#):
>
> I know this component is getting a bit old

Yup, it would be wonderful to have this updated to the current structure. Hey, I’d love it to be made #official as it is super helpful.

---

<div class="post-metadata">

### Author: ![davidkingham](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/davidkingham/32/119528_2.png) [@davidkingham](https://meta.discourse.org/u/davidkingham)
#### Post date: [October 23, 2024, 2:17pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/77 "2024-10-23T14:17:15Z")

</div>

FYI Nathan, I’ve forked this, and with the help of AI I have the idea working! Since I really don’t know what I’m doing I’m not sure if a PR is appropriate, but I’ll let other decide…

> **[GitHub - davidkingham/discourse-category-headers: Theme component providing...](https://github.com/davidkingham/discourse-category-headers/tree/master)**
>
> master

---

<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: [October 25, 2024, 8:31am UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/78 "2024-10-25T08:31:45Z")

</div>

Nice!! You had more luck (or skill) with the AI help than I did.

This whole theme component is a little bit hacky (part of its charm 😉), so your changes will fit right in. Definitely do a PR I reckon!

It would be nice to have a setting for it though, so as not to force a change on sites who are already using the component and who might not want that.

---

<div class="post-metadata">

### Author: ![davidkingham](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/davidkingham/32/119528_2.png) [@davidkingham](https://meta.discourse.org/u/davidkingham)
#### Post date: [October 25, 2024, 3:38pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/79 "2024-10-25T15:38:36Z")

</div>

Thanks Nathan, I used Claude 3.5 Sonnet FYI.

Here goes nothing, my first PR! 😅

[https://github.com/naidihr/discourse-category-headers/pull/11](https://github.com/naidihr/discourse-category-headers/pull/11)

---

<div class="post-metadata">

### Author: ![Rhidian](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rhidian/32/176630_2.png) [@Rhidian](https://meta.discourse.org/u/Rhidian)
#### Post date: [October 25, 2024, 5:39pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/80 "2024-10-25T17:39:19Z")

</div>

Thanks David. Impressive!

I’ve merged they in. Please test.

---

<div class="post-metadata">

### Author: ![davidkingham](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/davidkingham/32/119528_2.png) [@davidkingham](https://meta.discourse.org/u/davidkingham)
#### Post date: [October 25, 2024, 8:41pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/81 "2024-10-25T20:41:34Z")

</div>

Seems to be working well! 🎉

---

<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: [October 25, 2024, 9:21pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/82 "2024-10-25T21:21:30Z")

</div>

Looks great - it reveals that I’ve done a lot of very short category descriptions due to the limitation it addresses! Nice work.

---

<div class="post-metadata">

### Author: ![agemo](https://avatars.discourse-cdn.com/v4/letter/a/ac91a4/32.png) [@agemo](https://meta.discourse.org/u/agemo)
#### Post date: [January 17, 2025, 12:37pm UTC](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682/83 "2025-01-17T12:37:20Z")

</div>

Useful component and very welcome thanks, in initial use without reverting to custom CSS to solve issues. I thought perhaps these options could be highly useful for many use cases applications:

**A) Cascading Parent Category style/features - more options possible?**

There is this

> Show parent category logo - Show the parent category logo when a subcategory logo is not set

Would it be possible to have the same option for _“parent category bg image”_

If you have one parent category and 100 subcategories, setting the bg image manually for each one to reflect the same as the parent is obviously a task that is cubermsoe and burdensome, and when the logo feature is no required.

**B) More/Other options to Manage image sizing**

I found sizing when only wanting a category header/banner a bit tricky and a quick fix reverted to using the LOGO option and placing a transparent .png to lock in the heigh dimension for force and lock in the height of the banner image.

This had affects the /categories by creating a the effect of a large indentation space, but that’s not a big issue.

An option to quickly adjust Px height and width of various image components, would also be very useful here too.

Thanks again for this component. 👍

[Previous page](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682.md?page=3)

[Next page](https://meta.discourse.org/t/discourse-category-headers-theme-component/148682.md?page=5)
