Need help setting up category list images

Hi!

I would like to display category images in the category list kind of the same way users pictures are displayed on the recent view Cat茅gories - Discourse Meta.

I kind of got the result I would like to have by fiddling around in chrome inspect mode.

Do you think this is achievable in CSS or do I need to edit html templates ?

Website is live at APF - Auberge du Pixel Fringant (apfcommu.ga) if you want to see it live.

Thanks for your time :slight_smile:

Hi !

I鈥檇 say very likely and it seems you鈥檝e already found the way tinkering with chrome, so if your question is more 鈥渨here to apply my modifications?鈥, you鈥檒l find an example there:

and many more here Search results for 'category-list' - Discourse Meta

1 Like

Not really, I cheated by moving around some html elements.

In the example, they got it to work by removing the category descriptions and adding the descriptions directly to the images. I鈥檇 prefer to avoid doing this.

Oh I see, my bad :sweat_smile:
so as I鈥檓 really not good at css and I鈥檓 not sure you should go down the road of position : relative, in case you鈥檒l go for the html shuffling you鈥檒l find this more useful:

and there is discourse/category.hbs at main 路 discourse/discourse 路 GitHub , but as to make some changes to the discourse/index.html.erb at main 路 discourse/discourse 路 GitHub , you鈥檒l probably need a plugin.

1 Like

Not really good in CSS myself either.

Thanks for the ressources, will try to look into that when I have some more time.

I will probably need to go down the plugin road鈥

1 Like

I鈥檇 use this new component:

It will give you a cleaner markup to style with css. And have the same look on desktop and mobile with almost similar class selectors.

4 Likes