Blaugust 2022 – Creating a Category Page for an HTML Blog
Posted on August 7, 2022 by Aywren
There’s one major thing that’s built into WordPress blogs that I dearly missed when moving my content to a static HTML website – that’s a means to keep posts organized by topic. WordPress automatically does this when you apply things like categories and tags to a post, and I didn’t know that I’d miss it until I did.
So a secondary project to cleaning up my old archives has been to slowly build out yearly categories of my posts based on topic. I could probably create a tag system, too, if I wanted one. But I wrote that off as being too much effort when I really needed to get the bulk of the content in a cleaner form first. Maybe next year I’ll sit down and figure out how to code in tags.
But for now, I have found a way to create a category archive! Every time I clean up an old post or add a new post, I add it to the category page for that year. I’ve broken down the categories by topic – here you can see an example of the 2022 category page!
When you click on any topic box, it unfolds to show you the blog posts and the date of the posts within.
At first, I’d just made the category page an outright list under each topic – which does work. But when I realized how big and unwieldy the page would be once all the posts from a year were represented, I went with an accordion style drop-down for each topic to keep the overall page more tidy and usable.
If you’re interested in the code that I used for this, you can find it at W3 Schools!
And there you have it! My hand-coded method of creating a category page for a static HTML blog!