How to Create Custom Category Headers
-
Hello
I've found this topic on forum related to custom headers: https://community.nodebb.org/topic/2333
But this is a very old topic and plugin cannot be found in plugins page in CMS.
On top of that, as I can see this plugin shows random images for the categories.So I decided to make my own header. The matter is that I want to have a spefic (responsive) image for an each category (example on the images below). Can you, please, point out what's the most optimal way to create such header? Is it related to theme modification or plugins? Or whatever? I just don't know where to start from.
I use "Persona" theme with "Slate" style. Also I have experience in HTML, CSS, JS & NodeJS, but have zero experience in modyfying NodeBB themes and creating something complex as those headers which I described.
Thanks in advance for any help.
Live code examples and tutorials for beginners will be very helpful.
-
For a quick & dirty solution, I would create HTML widget and insert into Global header.
In Appearance -> Custom Javascript, I would add the magic here.
You can upload the images into Public folder and then create an array in the javascript.You can grab the title via the <meta name="title" content="Cat title"> tag and match it up with the images array. This is very manual so every time you change the category name you'll have to change in the javascript code as well. I take it though category name won't change that much when Live.
I have not tried this yet as It's just in theory.
