My setup for long static HTMLs with TOC and sections

[David Gifford]

Hi everyone

I updated my documentation to include a walk through on my set up for writing:

• Long static HTMLs that transclude sections
• with id's for section headers for quick navigation to and from a manual table of contents
• where the link back up goes all the way to the top of the file, not just to another section.
  

An example, in Spanish, of the output is https://giffmex.org/wiki/apocrifos.at.html

The walk through of how to do it, complete with button tiddlers and image tiddlers, is at:

https://giffmex.org/gifts/documenting.tw.html#My%20long%20static%20HTML%20setup

[springer]

David,

Thanks for sharing this. 

I'm anticipating a need to convert a TW resource into a static html archive so that it can be "handed off" to people who want something standard, linear, and familiar (and that can be served up in non-dynamic environments like sharepoint). 

So, I might take advantage of something like this. 

But one feature I wonder about is whether we can make ample use of html's <details> feature to make sections collapsible, preserving a bit of the dynamic experience without actually deviating from the linear flow of  static html.

Of course, there are a couple different variations on details / slider / reveal widgets in TiddlyWiki. I use TElmiger's plugin regularly, and would love if exporting to static html could translate over to html's simpler <details> (with <summary>) syntax. Does that sound possible to you?q

-Springer

[David Gifford]

Hi Springer

I use the details HTML in mine with statics. For an example, see the Instructions section of https://giffmex.org/wiki/apocrifos.at.html

You can't use Telmiger's plugin, or any plugin, with statics. But you CAN create buttons with simple details snippets.

I just updated this section for you. https://giffmex.org/gifts/documenting.tw.html#Sliders%20for%20static%20HTMLs%20with%20details%20and%20summary

Note that transcluded tiddlers work best if their text is wrapped with <span> and </span> IN the transcluded tiddler.

Enjoy!

[springer]

David,

Ah, I had not noticed that you had set up the Instructions as a details drop-down, nice! (The little triangle at left is a bit easy to miss when the summary doesn't have any additional css like contrasting background color.)

It sounds like the conversion process will be quite a project (given that I'm already fully invested in lots of things that won't convert easily into static html, and there's no automatic conversion for getting telmiger-style detail syntax boiled down to html details). 

Thanks for the documentation!

-Springer

[David Gifford]

On Sunday, February 14, 2021 at 9:54:03 AM UTC-6 springer wrote:

David,

Ah, I had not noticed that you had set up the Instructions as a details drop-down, nice! (The little triangle at left is a bit easy to miss when the summary doesn't have any additional css like contrasting background color.)

It sounds like the conversion process will be quite a project (given that I'm already fully invested in lots of things that won't convert easily into static html, and there's no automatic conversion for getting telmiger-style detail syntax boiled down to html details). 

Yes, if you have been using Telmiger's details plugin for a lot of tiddlers, it would take a while. But for starting from scratch, my actual process is actually fairly simple.