Help setting up tw


so, ive been looking around for a nice and easy to use wiki that i could sync between my laptop and my android phone and that i could work on offline.

basically, everyone points to tiddlywiki+tiddloid.
however, i find it’s “visual” a bit confusing and chaotic for me.

i also understand that tw is highly customizable, so i was wondering maybe there could be a way to set it up closer to what it would work for me?

ideally, i would like a visual that resembles this or this or a mix of both.

ideally, i would like that visual to be possibly replicated on tiddloid as well.

anyone here could help me with this? :heart:

Hi lucyferu

The trick is to find something that will work well with both the laptop, which is wide and large, and the android phone, which is narrow and small. Both of the links you shared work great on a laptop, but not so much on a cell phone. One has three columns, and the other has three sections, two navigational and one for content, similar to Evernote.

Stroll could be set up to approximate a two column version of the first option you listed. You could open the tiddlers you want open on startup, put them in their respective columns the way you want them, fold all the tiddlers, then add them to the list of tiddlers to display on startup.

You would probably want to decrease the tiddler title font-size. See my instructions here: Reducing the font size of tiddler titles

Thin frames and thin gaps would also give you more room: Thin frames and thin gaps

Unfortunately I can’t help you with tiddloid, I have no experience with it. But someone here should be able to help you.

1 Like

Hi Lucy

I use tiddlywiki on my android phone and now tablet as well as on my laptop.

Unless you know that you will be working intensively in the tiddloid GUI I would not personally focus too much on its appearance. In my workflow once I have tiddlywiki open I do not touch tiddloid again for the rest of the session - a few seconds is all - unless your workflow is radically different I don’t think you will spend much time looking at the user interface of Tiddloid. Maybe better to focus on changing the appearance of Tiddlywiki to suit your needs.

I don’t think the screen on a phone is ideal.

I use my phone version mainly for read only when sitting around waiting ( perhaps in a train station etc )

The main times I use the phone for write and read has been vacation and also Christmas out of the country with relatives, for this I have a blue tooth small keyboard to make life a bit easier but it has it’s limits.



Then an Ikea phone/tablet holder

My next wish for the keyboard would be to have an integrated mouse, I mostly use the mouse when editing a tiddler to select the field I want to type into. The issue here is that the best viewing angle for the screen is also the worst ergonomic angle for the wrist tapping the screen. I am looking around at folding keyboards with integrated mouse - most are unfortunately wifi and not bluetooth.

Recently I bought a Samsung A7 8" tablet which I have found to be still highly portable but a bit easier to use than a phone for serious work, it’s cheap and a great balance between size and portability. With the keyboard and tablet combo I get something that might be described as an android laptop but with separate keyboard for ergonomic advantage with a low overall weight ( less than 700 grams ).

I think there is a limit to how well a working environment can function on a phone, now the tablet is my second choice and phone has been relegated to third place and is simply for occasions when I forgot or couldn’t bring the tablet along. The phone only wins out now on rare occasions because it is always with me.

1 Like

The UI is quite different between those, so it would be much easier to help if you’re specific in what you refer to. And when you say that the “visual is a bit confusing”, which aspects - and are you referring to the TW UI or tiddloid (which I never tried, so I don’t know how it looks).

1 Like

thank you everyone for your answers and help so far!
i will try to address you all in one go hoping you will receive the notifications anyway. :sweat_smile:

yes, what you say it’s obviously true, in fact i guess i might have to change my approach and expectations.

your suggestions are amazing, but i have two more doubts now:

  • stroll is very cool, but it looks like it work through html file the same way this other tool i found out about does. is there a way to use them both at the same time? if yes, how?

  • the other two recommendations you give me are lines of code, but where should i inser them?

thanks for sharing all of this!!!
to address specifically now the bit that i quoted, yep, im afraid you might be right.
i believe i will work on it on my phone sometime, but it’s more likely it will happen through my laptop.

is there a setting to turn tiddloid into read-only and be sure there is no room for random changes made by mistake? :upside_down_face:

i do have a new tablet ive been trying to make work with some linux os.
maybe i should get back on it and try tiddloid there!
that’s a very good call. thank you! :smiley_cat:

once again, thank you for your reply.

i guess the possibility to have somewhere on my screen a global visual of all my wiki/projects/tiddlers/files and pick which one to access. as well as the possibility to hide everything, swap places, and just anything i would do to “make space and order on my desk” let’ say lol.

and i was referring to both because they seem very similar to me tbf.

@DaveGifford does this answer my question? :stuck_out_tongue_closed_eyes:

I am on vacation this week and traveling. Hope to look at this next week. Blessings!

1 Like

Hi Lucy

Dave says he is now away on vacation so I hope he will not mind me stepping in, he gave you some examples of CSS code to change font size and so on and you asked where to put the code.

If you are familiar with CSS…

You can create a new tiddler and give it a tag as follows…


Perhaps title it something like…

Custom CSS

You can add CSS to the regular text field of that tiddler to change the appearance of tiddlywiki.

As a test…

Add the following CSS to the main text body of your Custom CSS file…


And then create a test tiddler, insert some text and add the following to apply the above CSS to some of that text as follows

This is ordinary non-highlighted text @@.highlight And this is highlighted text @@

If all is well then part of the sentence should look like someone has been at it with a highlighter pen.

Dave included CSS tips for reducing font size and also making thinner frames.

Of course with CSS you have a path open for screen size specific CSS which might be an avenue for exploration - I haven’t explored screen specific CSS for a couple of years now so not familiar with the latest methods for trying to take into account screen physical size as well as resolution. But if you find a way to target only your phone then that might be your way forward.

Personally I also use the CSS to alter how my tiddlers look when printed, often I want to share paper copies with people who are not tiddlyiwiki afficiandos and so I remove some TW elements for the shared printed copies.

The only way I have found to reliably work out what TW CSS classes I want to over-ride is to look at an example in an open tiddly session and then use the developer tools available with most browsers to click on the screen element on interest and view the HTML and CSS source code for that element. The rest is the usual tinkering around.


At startup, the TWCore automatically defines two $:/info tiddlers that contain the device width and height (in pixels):

  • $:/info/browser/screen/width
  • $:/info/browser/screen/height

However, while these values accurately report the device characteristics, they do not always reflect upon the current browser window display characteristics. (e.g., if the device is rotated after loading the browser or if a desktop browser window is maximized/resized).

To address this, I have created which defines two new $:/info tiddlers:

  • $:/info/browser/window/width
  • $:/info/browser/window/height

Which automatically reports the current browser client window dimensions (in pixels). These values are set at startup, as well as via a window “event listener” that updates these values whenever the browser’s client window is resized (i.e., when rotating the device or maximizing/resizing a desktop window).


1 Like

Tiddloid has almost no UI presence. Tiddloid is a kind of browser that can bookmark, view, and, most importantly, save TW files. Except for the navigation panel at the top, everything you see on screen comes from your TiddlyWiki file when using Tiddloid.

There are ways to use other browsers, which will allow you to have almost the entirety of the screen provided by your TW file. Currently, at least on my device, you can use Opera browser to view your file. Viewed directly, the “save” mechanism will prompt you for a download, meaning that you would have to deliberately choose to write over your existing file. This effectively gives you a readonly mode.

Unfortunately this approach doesn’t work, AFAIK, with Firefox or Chrome browsers on Android. Instead you need an app like RCX to serve up the directory with your TW file. You can serve it up as HTTP, and use the “download” mechanism of the browser of your choice to save (or not save). Or you can serve as WebDav, where the save mechanism saves directly back to your current TW file.


thank you very much for the extra tips and sorry for the late reply.
i was away from home and any laptop for a while, so im catching up on stuff only now.

one thing i started wondering about is: does it make a difference if i use tiddlydesktop or tiddlywiki through web browser? do all the same things apply?

im also resharing the question i asked you at some point when you mentioned using tw on your phone as read-only.

stuff like this makes me wonder if all that has been said so far wouldn’t work on the desktop version?
sorry, but im a newbie in many fields. :sweat_smile:

oh, this is an answer to the readonly question!
thank you very much for it. :grinning_face_with_smiling_eyes:

however, i am still in doubt now for the same question posted above.
how using the desktop app rather than the web one would alter all that has been said so far.