How do you get custom page for category / tags list?

So I’m slowly building my theme in the spare time and it’s going along nicely.
I have a list.html page in /layouts/_default/ - and it is applied to all list pages.
But the thing is that I’d love to get different result if someone gets a list of articles, different for list of tags and different for categories.

So for articles I’d like to get cards like those (and I have code to style it this way obviously :slight_smile: ):

For tags I’d love to get a bunch of such buttons:
Zrzut ekranu z 2022-08-28 18-19-47

And for categories probably a hand crafted type of page with categories and descriptions (maybe automated if I figure out how to create a loop that would switch divs so the image would first display on the right then on the left and so on):

So I assume I should create more custom defaults - is that so? Where should I put those?

Option 1

To use different templates for articles, categories, and tags, do something like:

layouts/
├── articles/
│   └── list.html
├── categories/
│   ├── taxonomy.html
│   └── term.html
├── _default/
│   ├── baseof.html
│   ├── home.html
│   ├── list.html
│   └── single.html
└── tags/
    ├── taxonomy.html
    └── term.html

That assumes your content structure is something like:

content/
├── articles/         --> layouts/articles/list.html
│   ├── article-1.md  --> layouts/_default/single.html
│   └── article-2.md  --> layouts/_default/single.html
├── posts/            --> layouts/_default/list.html
│   ├── post-1.md     --> layouts/_default/single.html
│   └── post-2.md     --> layouts/_default/single.html
└── _index.md         --> layouts/_default/home.html

See https://gohugo.io/templates/lookup-order/

Option 2

To use the default list template, but change how each item is displayed depending on its type, use Content View templates in conjunction with the .Render method.

layouts/
├── articles/
│   └── summary.html
├── categories/
│   └── summary.html
├── _default/
│   ├── baseof.html
│   ├── home.html
│   ├── list.html
│   ├── single.html
│   └── summary.html
└── tags/
    └── summary.html

layouts/_default/list.html

{{ range .Pages }}
  {{ .Render "summary" }}
{{ end }}
1 Like