Switching between different blog themes; code and future fixes
I made a post the other day asking for help with building code that would let people switch between themes I made for this site.
Josh kindly emailed me with some help, offering this code which you can test on his blog here.
After screwing around with it I managed to put together a simple toggle box in the corner of the blog using his code. Eventually I'd like to build a select menu, but this works for now as a proof of concept. I have no idea how Javascript works so I'm building from the ground up!
Here is the code for anyone interested. I stuffed all of it into my header; adding more themes will mean jamming it full of multiple stylesheets unfortunately.
As of right now it is not persistent across the site, meaning you'll have to toggle a custom theme page-by-page. I'm fine with it for now; I mostly wanted to include it to show off the different themes, and I reckon most people will either use them on the homepage or while reading posts, not necessarily bothering with it as they explore the site as a whole.
Sylvia emailed me with a cleaner option but it requires Javascript pointing at individual .css files, which obviously aren't stored on Bearblog sites locally. I contacted Herman asking about whether he could allow .css files on the media server. It's a little buggy so I'll update again once things are operable.
If it doesn't work out, Josh's solution is still fine! I really appreciated the fact that he reached out with help for my silly little idea.
Future fixes I have in mind:
- change toggle boxes to a select menu
- move about, navigation, etc page headers into the root theme .css so I can have custom colors matching different themes; right now it's all static yellow images coded into the page text itself
- switch to styleswitch.js?
- make CSS code for the post footers I made in my post template so that the special character (✘) matches the blog theme
My blog code overall needs a LOT of cleanup... but everything works, and I don't want to break anything, so I'll leave it for now until I get bored some day haha.
Now that this is finished, I'll be working on catching my art and writing pages up to date so I can start posting there as well, and importing their themes here to my main blog (and vice versa) just for more proof of concept work with the theme toggles. I will also be appending this update to my site changelog.
Take care! I hope everyone has a lovely Christmas.
✘ Posted on — 12/24/24
✘ Last modified — 8 months, 1 week ago
✘ Link — https://blog.xavierhm.com/switching-between-different-blog-themes-code-and-future-fixes