25-Jan-2022: TiddlyWiki Static Site Generation, Decent URLs, and Pretty Titles

Someone wrote to me and asked me how I keep my TiddlyWiki tiddlers' URLs from getting encoded + if I'll make a tutorial about what I've done here with TiddlyWiki.

Here I'll first address the tutorial question and then the URL encoding one.

Tutorial

Over time I will likely compile a tutorial on what all I've done so people can do it, too.

However, I recommend that you look through the tutorial here, which I learned much of this from. I do not recommend trying to use their script that supposedly fixes the encoding thing (mentioned on this page), as it did not work for me and I wasted a lot of time trying to get it to work or figure out a similar solution. (Though, please let me know if you happen to figure it out or find a different, working solution!)

URL Encoding Workaround

The URL encoding in TiddlyWiki is really annoying. I use a workaround solution that works but isn't great. I'll describe it here:

By default TiddlyWiki uses the tiddler titles to do two things: (1) set the filename for a tiddler file and (2) set the title of the tiddler itself. The first one is what's causing us to need to have the URLs get encoded strangely.

My approach (which first learned about from here) is to only use the tiddler "titles" (title) for setting the filename; instead, I store the *real* title for each tiddler in a custom field, which I called showname, after the referenced article. Whenever I need to link to a tiddler, I link to its filename, title, but when I need to display its real title, I display the tiddler's showname. In the tiddler editing interface, I added a new textbox that lets me quickly enter in a value that's saved as the showname, and I switched the interface around so the showname's text area is emphasized and the title one is de-emphasized.

For example, in the TW interface, this post looks like the below image. Its showname value is 27-May-2021: TiddlyWiki, and its title is 27-May-2021-TiddlyWiki.

I did these interface tweaks in this commit. I haven't updated my TiddlyWiki install in a while, but I think that you can download that file and stick it into your TW folder's tiddlers subdirectory and have this working for you. You'll just need to swap out the mentions of title in the templates that you use for the static site version of your site. (As I did here.)

Additionally, I have tweaked the New Journal Here button so that it sets the new Journal tiddler's showname and title values by default and adds the original tiddler as a tag. I did that in this commit.

I recommend that you give this a try. It leads to a couple of quirks that can be overcome or overlooked (like that until you add showname values to all tiddlers, some of them won't explicitly have pretty titles, like with this old post (note that in the window's title it just says " - Tactical Typos", since it's supposed to say "[showname] - Tactical Typos")).