What's the best way to make a custom category page style?

Hi, i would like to create a category page style like forums.envato.com.

The title and description of the category.
The subcategories if exists in that category.
Some topics of that category.

How can I best achieve this? With a theme component? Or i can do it also in a theme?

1 Like

That looks like they didn’t use a public component but a custom handlebars-template for the category list.

One way to achieve a different look for the category list is picking a default style that comes closest to what you want from the site-setting desktop category page style, e.g. Subcategories with Featured Topics:

Screenshot from 2022-07-31 20-45-55

And then style that default template with CSS.

That’s pretty straightforward on one hand. But as the setting name suggests, this only affects the desktop layout. Afaik there’s only one default mobile layout right now and it uses it’s own layout template. So that can be a rather limiting downside of that approach.

Another way is indeed to make your own layout and use that on both desktop and mobile. Could maybe look at GitHub - discourse/discourse-minimal-category-boxes as an example how to set this up in a component.

I think it just inserts the new template above the default ones on desktop and mobile and hides those with CSS. Would that actually be the simplest and recommended approach?

1 Like