展示的类别

:discourse2: Summary Showcased Categories allows you to add two “Showcased” topic lists (built from your choice of two different categories) to the top of your forum’s home page.
:eyeglasses: Preview Preview on Discourse Theme Creator
:hammer_and_wrench: Repository Link https://github.com/discourse/discourse-showcased-categories
:open_book: New to Discourse Themes? Beginner’s guide to using Discourse Themes

Install this theme component

Features

In the theme component settings, you can customize the name of each column, as well as choose which category to pull from, along with the maximum amount of topics from that category you’d like to display.

Settings:

Name Description
show as sidebar If enabled, the showcased categories will only be rendered in a sidebar on the latest page.
feed one title Title for first feed of topics
feed one category Single category to source topics from
feed one tag Optionally source topics from multiple tags, can be combined with a category
feed two title Title for the second feed of topics
feed two category Single category to source topics from
feed two tag Optionally source topics from multiple tags, can be combined with a category
max list length How many topics should appear in the custom lists?
plugin outlet Advanced setting for additional customization
Translation Default
showcased_categories.new_post Post
showcased_categories.view_more More

Credits

Thanks to @awesomerobot for building out the original structure of this component. :+1:


:discourse2: Hosted by us? Theme components are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-06-15T11:52:37Z

Check documentPerform check on document:
44 个赞

That’s great! I was recently thinking about something like that.
Thanks Jordan!

8 个赞

Thanks, Jordan!
Looks really interesting!

3 个赞

Suggestions to improve this component:

  • User customized or group customized. For example, we have different groups for which certain categories are more important than others. Of course, they change according to the group. So, it would be great if the component could be either user customized or at least that the admins could choose which categories to showcase according to group
  • To have the option for a sidebar instead of upfront, at least in the Latest view would be great.
5 个赞

Thanks for the feedback here!

This is an interesting suggestion :+1:. I wonder how we would handle a user who takes part in multiple groups? This could get a bit complicated but I do like the idea.

A sidebar could be nice as well :grinning_face_with_smiling_eyes:

5 个赞

You can now choose to display the lists in a sidebar in the latest view :grinning_face_with_smiling_eyes:

Thanks for the suggestion.

5 个赞

Really great!! :+1: Will try and leave feedback.

3 个赞

Ok, so… the sidebar doens’t seem to work out of the box with non-default themes. We have a custom version of the Material Design theme and the featured categories appear above the latest list even in sidebar mode (and it actually breaks the margins layout). I’ll try to check if there’s a way around it.

2 个赞

Jordan, hi, thanks for such a great compoment, but I still have a question, namely, is it possible to make the color of the blue bar customizable? Is there a way to change it in the plugin’s settings or to show the category’s design color?

1 个赞

Sure!

To do so, you will need to do so either in your custom theme, or theme-component (probably the easier route).

What you want to target is .custom-homepage-columns .header-wrapper.

Something like this should work:

.custom-homepage-columns .header-wrapper { 
    background-color: `your color here`;
}
3 个赞

Hi, Is it possible to make the entire block 2 times smaller in height, so that as a result, 2 times more news would be placed in the block, with the same block size as now.
Thank you.

2 个赞

We have a max of 5 topics to be shown in each list currently. As far as spacing goes though, you should be able to target the css classes in the block to get the desired affect you want. :+1:

1 个赞

Hi, can you post an example? Thank you.

1 个赞

Sorry, new to theme editing. Does this mean I have to duplicate the component to be able to edit the colors? Is there another way to pull up the HTML/CSS?

1 个赞

Sure!

To change the height of the topic-list items you would target this:

.custom-homepage-columns .topic-list .main-link { height: ??? }

Other than this though, the minimum allowed to show is 1 and the max is 5.

2 个赞

Understandable!

You do not need to duplicate the component in order to customize the look of this theme component.

Here’s what you will need to do:

  1. Navigate to /admin/customize/themes and click on components
  2. Click on install then create new and make sure you select component, you can name it whatever you wish!

It will then appear in the unused components area:

You will then need to enable it on your currently selected theme on this same page:

Once that is done you can click edit CSS/HTML

image

From there, you can add the customization css on the commoncss tab. You can add the code I shared earlier in there.

.custom-homepage-columns .header-wrapper { 
    background-color: `your color here`;
}
3 个赞

Thank you! Seems so simple now :man_facepalming:

2 个赞

大家好!根据群组成员身份展示不同分类的想法正是我想要的。当一个用户属于多个已配置了展示分类的群组时,TC(主题分类)可以根据用户的首要群组来决定。

在我的案例中,我们有面向广告客户的私有分类。我们正在寻找一种方法,在主页顶部展示他们各自的分类。这样他们就不必在论坛中翻找来搜索它了。

3 个赞

嘿,伙计们 @jordan.vidrine 我这里看不到这个组件在工作……以及 discourse Air 主题。
这是我的设置。


但我看不到侧边栏……我猜是因为搜索栏,我不能把它放在横幅部分。

2 个赞

你找到解决办法了吗?我正在使用 Air 主题。

2 个赞