How to make a button to export static html files

Hello everyone. I have been using Tiddlywiki for many years but I am a relative newbie to coding. I run my wikis in TiddlyDesktop, although I have played around with Node JS.

I am trying to create a static website and to do this I want to create a button which will export selected tiddlers as individual html files, rather than as a single html file, while maintaining their respective links and the Tiddlywiki look. Is this possible?

I know how to create a button to carry out easy tasks but do not know how to initiate more complex commands.

Having looked on Tiddlywiki.com, I thought I would use the --render command, if that is the right command to do what I want, but I have stalled at the first hurdle as I do not know how to initiate the command with the button I have created.

I have tried the ‘export as static html’ within the wiki and this works fine but I would prefer to have individual html pages.

Help would very much be appreciated. Apologies if this topic has been answered before but my searches have been in vain!

1 Like

While not exactly your question, if you hit the down arrow on a tiddler, then export, then static HTML, that should achieve your goal.

Edit: nvm I didn’t see that you mentioned that.

While this would not be inside the wiki, you could setup a batch script or something that runs the command when you click on it. Not sure what I would do otherwise, short of a lot of js

Please see: How to use TiddlyWiki as a static website generator in 3 steps - Ness Labs
and: https://tiddlywiki.com/static/Generating%20Static%20Sites%20with%20TiddlyWiki.html

You will be running a few commands from a bash command-line window to generate the static files. Once generated, you would need to host them somewhere.

@Rob_Jopling, i face almost the same challenge as you describe! – last month i struggled for a few days and eventually came up with the below notes-to-myself summarizing how i finally (mostly, partially) succeeded – ANY SUGGESTIONS ON HOW TO DO THIS BETTER would be hugely appreciated! :unicorn:

Context: my personal journal is called “ZhurnalyWiki” (https://zhurnalywiki.tiddlyhost.com/ based on http://zhurnaly.com ) – i converted it a few months ago from Oddmuse into TiddlyWiki – it has >8,000 tiddlers so it isn’t feasible to do “by hand” – the static HTML results of the conversion are in http://zhurnaly.com/z – the instructions-to-self summarizing the steps to do this are (from ZhurnalyWiki tiddler Export Static Tiddlywiki Single File Tiddlers in HTML ) :

  • if not already installed, on the local machine (Mac Airbook in UNIX or whatever), install node.js and install TiddlyWiki as per Installing TiddlyWiki on Node.js
  • in the browser within ZhurnalyWiki, export the tiddlers in using the “Tools” command “export all” – to create a “JSON” set of all the tiddlers as a single-file tiddlers.json
  • load the tiddlers in that resulting single-file tiddlers.html, and save them into selected folder_name:
    • tiddlywiki --verbose --load ./tiddlers.json --savewikifolder ./folder_name
  • cd into folder_name, and then execute the following commands, following the method for doing a static export of all files as per Generating Static Sites with TiddlyWiki:
    • tiddlywiki --rendertiddlers '[!is[system]]' $:/core/templates/static.tiddler.html static text/plain (may take a while!)
    • tiddlywiki --rendertiddler $:/core/templates/static.template.html static.html text/plain
    • tiddlywiki --rendertiddler $:/core/templates/static.template.css static/static.css text/plain

At this point i hit another snag (perhaps related to my http://zhurnaly.com host’s Apache configuration? dunno!) – i found that inter-tiddler links did NOT work from the server http://zhurnaly.com/z – all the links that had %-sign URL-encoded filenames failed :cry:

So i wrote some tiny Perl scripts to put in the %-signs as needed (for spaces, hashtags, commas, quote-marks, etc.) – they are crude but they seem to work.

Hope this makes some sense and is of some slight help, Rob! – again, when you figure out how to create a static website from your Tiddlywiki PLEASE LET ME KNOW so i can follow in your footsteps! – and anybody else who can tell me how to do it, THANK YOU likewise! :bird:

Hi there

Thanks for taking the time to respond to my query. I have not solved the problem yet but I did find a very comprehensive article here Exporting Static Sites From Tiddlywiki: Didaxy.com — Tutorials, index, Configurator,http://www.didaxy.com which I currently reading. I will then try to follow the instructions step-by-step. Maybe it will be of some use to you and others.
Best of luck.

TY, @Rob_Jopling ! – quite helpful – and Part 5 of your article nicely explains what seems to be my own problem:

You could go ahead and host your site on a live server and there’s a chance you would be fine and not notice a problem. But there’s also a chance of it breaking.

The reason is that some web hosts try to be ‘helpful’ and URL encode all your filenames for you, which leads to them being double URL encoded, meaning that as well as the space being encoded to %20, the % gets encoded to %25, leading to each space being replaced in the end by %2520.

If that happens then your links, which are still only single URL encoded, now no longer point to your files.

… it looks like that reference has a good way to solve that problem – thank you again, Rob! :rabbit2: