June 12, 2024

Tags: Site Updates

Or more accurately; a blog post about my fun adventure in updating the blog! Again!

As you may have noticed, the blog looks entirely diffrent now. Posts are nestled into an iframe now, and there are also tags! AND an RSS feed!!! As there's a lot to this update, I figured it best to go ahead and explain my processes here in making this update and the logic behind it. I'll also explain my general process for making blog posts.

Tags

The tags are pretty simple: Each post can fall under one or more "catigories" depending on what it talks about. My blog doesn't need this feature right this moment, but I do want to post more - at which point, such organization would be useful. I just wanted to make this now while it's still easy to update. Would much rather go back and add tags to just four posts rather than like... ten.

So now there's a list of all tags, with each tag having a list of what posts use that tag. Additionally, each post also ends with the tags I've used for it. Just in case someone really liked a particular post and wants to see more posts like it.

I do have a finite list of tags that I do not forsee myself expanding on. That being said, not all of the tags have been added to the site. I have topics I want to write about, but haven't yet. Didn't see the point in listing a tag with a total of 0 posts. So while I am giving myself a hard limit on topics/tags, do expect a few more to pop up as I actually write stuff for them!

iframes

Last post I talked about how I don't particularly enjoy having to edit every page on my site - with the blog going to eventually be what takes up the most pages - whenever I make a change to the top navigation bar or the footer. Thus I made the top nav bar an iframe, so that when I want to update it I can update just the one file. The footer and info button block (the thing to the side/top with anti-nft, stand with palastine, and age rating buttons) are the only other things I anticipte having to update regularly. Thing is, I don't see myself having to update them that much. Not to even mention that I'd have three iframes on almost every page to make it work the same way. Given how iframes can be a little demanding on browsers (mostly an issue with very low RAM tech or slow internet speeds), I want to minimize the ammount of iframes I use. So if I can't just have one file to edit to change the entire site, maybe I could find another way to at least cut back on the page editing?

Thus, at midnight last night, I came up with an idea: if the blog posts are what will eventually be the biggest hurdle in mass-editing the site, then why not put them into an iframe so that I can edit just one file for all of the posts?

So, uh. That's what I did! I made a new page simply called "/blog/post" and put an iframe inside of it. The blog posts appear inside of it, allowing me to edit just the "/blog/post" page when mass edits arise. This, ironically enough, did require me to edit all of the blog posts. They now just contain the post information and use a seperate CSS sheet that I'll have to trim down at some point (as I just copy/pasted the main CSS sheet code to expidite the process, which results in a lot of CSS code lines that do a whole lot of nothing).

There was just one teeny tiny problem, one that bothers me a lot. Fun fact, a small web pet peeve of mine is when a site is almost entirely iframe based and doesn't have an easy way to link to particular pages. Yes, there's simple ways around this. No, it's not too big a deal. That's why it's a pet peeve, a small annoyance. Anyways, I did not want to be a hypocrite and have my site feature one of my pet peeves. So I looked for a way to have the URL change based on the current contents of the iframe, thus allowing for linking to spesific posts while staying on "/blog/post". What I found was some JavaScript code made by MelonKing (warning for eyeburning colors on the site).

Pros: Super simple to add to site, works well

Cons: Is JavaScript, due to the way I format my blog URLs they come out very ugly looking. So many % signs...

I can easily reccomend what I've found here. Please, if your site is iframe based please use it or something similar.

RSS

RSS is suprisingly easy to add to your site. I like to do a lot of things by hand (yes, I know, I'll get to that) so the RSS is also being done by hand via this guide made by Chesapeake. Do exactly as the guide says (and make sure your items are within <channel> and </channel>) and you'll have a valid RSS feed. The W3C validator will have reccomendations on how to improve it, but they're not needed. I couldn't find clear documentation on how exactly to add these improvements, and putting them in wrong invalidates the feed, so I didn't bother.

... That all being said, please know I wasted so much time trying to figure out why my feed was invalid despite doing everything right. The issue? My keyboard is messed up - sometimes I press a key and it doesn't register. Worst of all, I don't always catch when this happens. So I spent 20 minuites trouble shooting the stupid feed only to find out that my keyboard typed "my" instad of "may" in the date feild. Yeah.

Right now, the RSS just lets you know that I have made a blog post. I'll have to experiment with it to allow you to read the entire post within your RSS reader of choice.

My Process

To end this off, I figured to go ahead and share my process for making blog posts. As I said earlier, I'm a madman who does almost everything by hand. There are ways to streamline this - there's numerous staic site generators and also the much simpler Zonelets for those who want to run a blog on their own site but don't want to do it by hand. I, however, have a system and that system works for me. I'll keep doing things the hard way. And here is that hard way!

1. Write the blog post on Joplin. Joplin functions on markdown text, which is much quicker to write in than HTML is. Plus it syncs between my computer and phone, so I can write whenever and wherever. Very handy.
2. Convert the markdown into HTML. There's lots of options for doing this automatically - even I have my limits - so just choose what you like. I personally use Code Beautify's converter. I just paste in the markdown text from Joplin and now I have HTML code ready to be copy/pasted. Nice.
3. Paste the HTML into my post template file on my computer, and save as according to my prefered scheme (which is by date). I then edit it to tighten up some things the converter can't do, like havetarget="_blank in the links. I then upload the file to my site.
4. I update the "/blog/post" page to default to the new post.
5. I update both the archive and the tags pages to include links to the new post. I also update the previous post's navigation to include a link to the new post.
6. I update the RSS feed to include the new post. After a while, I'll probably remove old posts from the feed just to manage the file size.

I could probably find some way to automate this, but I honestly could not be bothered lmao. Like I said, this is the system that works for me. So I'll probably keep using it until it stops working for me.