# Featured Lists

**URL:** https://meta.discourse.org/t/featured-lists/288916
**Category:** Theme component
**Created:** [December 16, 2023, 1:06pm UTC](https://meta.discourse.org/t/featured-lists/288916 "2023-12-16T13:06:43Z")
**Posts on this page:** 20
**Page:** 1

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [December 16, 2023, 1:06pm UTC](https://meta.discourse.org/t/featured-lists/288916/1 "2023-12-16T13:06:43Z")

</div>

| | | |
| --- | --- | --- |
| ℹ | **Summary** | Create and feature custom topic lists |
| 🛠 | **Repository** | [GitHub - nolosb/discourse-featured-lists: A Discourse theme component to feature custom topic lists. · GitHub](https://github.com/nolosb/discourse-featured-lists) |
| ❓ | **Install Guide** | [How to install a theme or theme component](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682) |
| 📖 | **New to Discourse Themes?** | [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) |

Install this theme component

The component lets you filter custom topic lists and showcase them on your forum.

### Default look

 ![image](https://global.discourse-cdn.com/meta/original/4X/e/8/3/e831d4d81b547d1fe37b29d3bce323a68a54cb9c.png)

### Settings Editor

 ![image](https://global.discourse-cdn.com/meta/original/4X/9/6/2/9626e310cb42edffb33223d12f815c144c57b52f.png)

### Styling

For CSS styling the component structure is:

```plaintext
.featured-lists {
  &__wrapper { }

  &__list-container { }

  &__list-header { }

  &__list-body { }
}

```

For example you could style an old-school board look:

 ![Screenshot from 2023-12-16 10-44-42](https://global.discourse-cdn.com/meta/original/4X/d/7/2/d72b15d8a355d0db41fe72be54dd2c95692db491.png)

Or modern minimal panels:

 ![Screenshot from 2023-12-16 11-32-21](https://global.discourse-cdn.com/meta/original/4X/d/6/6/d665d05f36d91ec0b4ea7869da964ae7f1e786e6.png)

If you do custom styles, please share them on this topic! ✨ 💖

---

<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: [December 21, 2023, 8:06pm UTC](https://meta.discourse.org/t/featured-lists/288916/2 "2023-12-21T20:06:59Z")

</div>

Hi, how can i prevent the about the category topic from being displaed in the featured lists?

Also is it possible to hide a row if there is no topics within it? For example if i use a row for **New** topics it shows empty with the row information but no topics.

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [December 21, 2023, 9:57pm UTC](https://meta.discourse.org/t/featured-lists/288916/3 "2023-12-21T21:57:07Z")

</div>

> [@digitaldominica](#):
>
> is it possible to hide a row if there is no topics within it?

Thanks for the feedback! I just updated the component, so it doesn’t render empty lists.

> [@digitaldominica](#):
>
> how can i prevent the about the category topic from being displaed in the featured lists?

I don’t see a dedicated class for the about topics. But you could use a style declaration to hide pinned topics from the featured lists:

```plaintext
.featured-lists__list-body .topic-list-item.pinned {
  display: none;
}

```

---

<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: [December 21, 2023, 11:10pm UTC](https://meta.discourse.org/t/featured-lists/288916/4 "2023-12-21T23:10:14Z")

</div>

Thanks for the update, it works out great. Is it possible in the future that the post button by more actually posts to the designated category for the corresponding row?

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [December 22, 2023, 1:05pm UTC](https://meta.discourse.org/t/featured-lists/288916/5 "2023-12-22T13:05:08Z")

</div>

> [@digitaldominica](#):
>
> Is it possible in the future that the post button actually posts to the designated category for the corresponding row?

That should already work like this:

- If you set a category or a tag the composer will pre-fill either or both.

- If the list has no set category, the composer will pre-fill with the value from the site-wide setting `default composer category`:

How does it not work for you?

---

<div class="post-metadata">

### Author: ![Lilly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lilly/32/575047_2.png) [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [December 22, 2023, 3:15pm UTC](https://meta.discourse.org/t/featured-lists/288916/6 "2023-12-22T15:15:40Z")

</div>

Nice component @manuel, I really like this, especially how easily customizable you made it so it can be adapted to other themes. Great work and thanks for sharing! 👏 🙂

---

<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: [December 22, 2023, 9:35pm UTC](https://meta.discourse.org/t/featured-lists/288916/7 "2023-12-22T21:35:47Z")

</div>

Hi yes this works, what I was asking is if I set a category on a row that is different from the default one in admin, can a person who clicks post go to that category and not the one set in the admin settings?

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [December 23, 2023, 2:01pm UTC](https://meta.discourse.org/t/featured-lists/288916/8 "2023-12-23T14:01:19Z")

</div>

I’m not sure what you’re trying to achieve.. could you explain it with an example?

---

<div class="post-metadata">

### Author: ![hoangviet](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hoangviet/32/174417_2.png) [@hoangviet](https://meta.discourse.org/u/hoangviet)
#### Post date: [January 4, 2024, 1:02pm UTC](https://meta.discourse.org/t/featured-lists/288916/9 "2024-01-04T13:02:18Z")

</div>

If I set `show on` to `Everywhere`  
How to hide Featured Lists when opening topics of a specific category?

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [January 8, 2024, 9:47am UTC](https://meta.discourse.org/t/featured-lists/288916/10 "2024-01-08T09:47:55Z")

</div>

You could either fork the component and add your specific condition to [discourse-featured-lists/javascripts/discourse/components/featured-lists-wrapper.gjs at main · nolosb/discourse-featured-lists · GitHub](https://github.com/nolosb/discourse-featured-lists/blob/main/javascripts/discourse/components/featured-lists-wrapper.gjs).

Or just use some CSS declarations to hide the component on your specific categories.

---

<div class="post-metadata">

### Author: ![DonkeyKongEnjoyer](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/donkeykongenjoyer/32/377672_2.png) [@DonkeyKongEnjoyer](https://meta.discourse.org/u/DonkeyKongEnjoyer)
#### Post date: [April 10, 2024, 11:55pm UTC](https://meta.discourse.org/t/featured-lists/288916/11 "2024-04-10T23:55:53Z")

</div>

This theme-component is awesome! Apologies for necroing this topic, but I have a question about this component.

Would it be possible to display categories instead of topics?

For example, instead of this list body containing four different topics, it would contain four different categories, and clicking on one of them would direct you to that category.

 ![feature2](https://global.discourse-cdn.com/meta/original/4X/8/1/c/81c4fb568549f993c534f12f38893dc66d939dc8.png)

---

<div class="post-metadata">

### Author: ![dmitcha](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dmitcha/32/376471_2.png) [@dmitcha](https://meta.discourse.org/u/dmitcha)
#### Post date: [April 15, 2024, 5:41pm UTC](https://meta.discourse.org/t/featured-lists/288916/12 "2024-04-15T17:41:48Z")

</div>

A nice plugin - thanks! In the plugin editor, I tried to increase the display count from 3 to 5. It saves, but then it reverts to 3, even though several categories have more than 3 items. Is there a way to override the max=3, or another approach to achieve this?

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [April 15, 2024, 7:18pm UTC](https://meta.discourse.org/t/featured-lists/288916/13 "2024-04-15T19:18:16Z")

</div>

> [@dmitcha](#):
>
> It saves, but then it reverts to 3

With the editor you have to save twice, once on the editor window:

 ![image](https://global.discourse-cdn.com/meta/original/4X/c/2/9/c292e29f8ffd7362ef54390e37acfadb3ea92481.png)

And then again on the component’s main page:

![image](https://global.discourse-cdn.com/meta/original/4X/1/1/6/1166b17b7d25a287c1cf2499798c10bf5d98df4f.png)

Maybe that’s causing your issue? Setting any number of topics works fine for me.

---

<div class="post-metadata">

### Author: ![dmitcha](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dmitcha/32/376471_2.png) [@dmitcha](https://meta.discourse.org/u/dmitcha)
#### Post date: [April 15, 2024, 8:00pm UTC](https://meta.discourse.org/t/featured-lists/288916/14 "2024-04-15T20:00:58Z")

</div>

That was exactly it; I missed that step. Thank you very much for your speedy reply and very useful plugin.

---

<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: [August 11, 2024, 12:15am UTC](https://meta.discourse.org/t/featured-lists/288916/15 "2024-08-11T00:15:51Z")

</div>

> [@manuel](#):
>
> I don’t see a dedicated class for the about topics. But you could use a style declaration to hide pinned topics from the featured lists:
> 
> ```plaintext
> .featured-lists__list-body .topic-list-item.pinned {
> display: none;
> }
> 
> ```

I am wondering… Couldn’t the About topic be unpinned and unlisted?

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [August 11, 2024, 10:14am UTC](https://meta.discourse.org/t/featured-lists/288916/16 "2024-08-11T10:14:10Z")

</div>

> [@Heliosurge](#):
>
> I am wondering… Couldn’t the About topic be unpinned and unlisted?

I guess you could. The result would be different though, the topic being generally hidden. In my experience it’s actually more common that you would want to show a selection of just the most recent topics on a featured list, but still want pinned and also About topics visible in other places.

---

<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: [August 11, 2024, 11:26am UTC](https://meta.discourse.org/t/featured-lists/288916/17 "2024-08-11T11:26:03Z")

</div>

I would be curious with it being a special topic(ie ppl have discovered they really don’t want to be deleted). That unpinninf and unlisting in theory shouldn’t affect for example category description in is it Category Boxes?

---

<div class="post-metadata">

### Author: ![Maria](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/maria/32/454575_2.png) [@Maria](https://meta.discourse.org/u/Maria)
#### Post date: [October 9, 2024, 1:58pm UTC](https://meta.discourse.org/t/featured-lists/288916/18 "2024-10-09T13:58:04Z")

</div>

Hey, this component works almost perfect for me, however i would like to have the option to place the lists below instead of above.

![image](https://global.discourse-cdn.com/meta/original/4X/7/2/e/72e01d4a50fc7d729135dcef1753378948f55fdc.png)

Is there an easy way to do this? From what i saw in the repo it looks like it is not yet intended.

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [October 9, 2024, 2:47pm UTC](https://meta.discourse.org/t/featured-lists/288916/19 "2024-10-09T14:47:12Z")

</div>

@Maria you could place the component on any plugin outlet. You can use the [Plugin outlet locations component](https://meta.discourse.org/t/plugin-outlet-locations-theme-component/100673) to inspect available outlets.

---

<div class="post-metadata">

### Author: ![hoangviet](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hoangviet/32/174417_2.png) [@hoangviet](https://meta.discourse.org/u/hoangviet)
#### Post date: [December 2, 2024, 3:13am UTC](https://meta.discourse.org/t/featured-lists/288916/20 "2024-12-02T03:13:43Z")

</div>

@manuel @Lilly about Css.  
I have 2 lists from 2 categories: Yoga and Fitness.  
I am setting both lists to display everywhere.  
How to hide the list of “Yoga” when opening any topic (it will still show on the home page, category and other places)  
The list of “Fitness” is still displayed everywhere.

Thanks to the experts of Discourse

[Next page](https://meta.discourse.org/t/featured-lists/288916.md?page=2)
