Changing font size

#1

Hi,

I’m using TiddlyDesktop with my TiddlyWiki on an iMac and the font is a bit too small. There doesn’t seem to be an option to change the font size at the level of TiddlyDesktop (though that would be great!). It seems that I’ll have to change something in the TiddlyWiki itself to achieve this. By searching through the HTML file and trial/error, I figured out how to change the font size for title, tags, table of contents, but didn’t actually figure out how to change just the normal font size in a tiddler. Does someone know how to do this (I looked a bit at previous related discussions, but didn’t find what I need)?

Thanks so much!

#2

They are in the Control Panel under Appearance/Theme Tweaks.

Or, you can go to e.g.

$:/themes/tiddlywiki/vanilla/metrics/bodyfontsize

$:/themes/tiddlywiki/vanilla/metrics/fontsize

#3

Here’s an alternative way to change the font size for the entire TiddlyWiki, without having to change specific items…

Create a tiddler, tagged with $:/tags/Stylesheet, containing:

body.tc-body
   { font-size:120%;line-height:1em; }
.tc-tiddler-frame .tc-tiddler-body
   { font-size:120%;line-height:1em; }
  • The first rule changes the text size (and line height) except for the tiddler body text.
  • The second rule changes the text size (and line height) for the tiddler body text.
  • Note that this doesn’t affect some embedded images, which have their own hard-coded sizes (e.g., the “thumbnails” in https://tiddlywiki.com/#HelloThere)

-e

2 Likes
#4

Just so it is not forgotten you can in windows hold the control key and use the plus + or Minus - keys Or the mouse roller, to zoom in or out. This is by far the quickest way to adjust the font.

You can also use ctrl+ - and ctrl+= to the right of the numbers on a QWERTY keyboard

#5

After complete solution by Eric, you also like to see Change Body Font Size
in TW-Scripts

#6

Thanks for all the suggestions!

I went with a slight variant of EricShulman’s solution. The line-height by default seems to be quite a bit larger than 1em, something like 1.4em, so it looked bad when I used 1em. I ended up doing line-height:1.4em which works well.

Unfortunately CodaCoder’s suggestion did not work for me, though I think it would work for the latest version of TiddlyWiki. I’m using a slightly older version; I tried to upgrade to latest, but it broke some other stuff in my TiddlyWiki that I need (namely MathJax support for latex).

It still would be great if one could do in an in-app zoom in TiddlyDesktop (TW_Tones suggestion does not work for me, though it does work in say Firefox; unfortunately it seems one can no longer edits TiddlyWikis with firefox). One advantage of this would be that I could easily use a different level of zoom on my laptop vs desktop.

#7

Hi @chebyshev,

My plugins Tix and Lox provide an in-app text zoom, you can test it here:
https://tid.li/tw5/test/tix.html

In the sidebar you should see a Design tab and its sub-tab Page offers sliders for the text zoom and line height as well.

I do not use TiddlyDesktop and you might not need the other features of Tix … but I guess Lox could be slightly modified to provide what you want.

All the best,
Thomas

Plugins are here: Plugins — Utilities for TiddlyWiki

#8

It should be noted it is also possible to change the following settings from the ControlPanel → Appearance → Theme Tweaks

I tinkered with these and set them to 95% and 135% respectively. I also use the default browser zoom as well depending on the screen size I’m using.

  • $:/themes/tiddlywiki/vanilla/metrics/bodyfontsize
  • $:/themes/tiddlywiki/vanilla/metrics/bodylineheight
#9

This does not sound correct. If you can provide any more details I am sure I have a solution.

#10

As Tony wrote: That does not sound correct. You can save TiddlyWiki with every browsers default download mechanism. You only need to take care that you “Save As” and overwrite the right wiki.

I’m using FireFox as my main browser and saving my wikis works well.

#11

I need the browser to autosave after I finish editing any tiddler (I also like the automatic backup feature). Is that still possible with Firefox?

About five years ago, I was using the TiddlyFox browser extension for this, which seems to incompatible with changes to Firefox that have happened since.
https://tiddlywiki.com/static/TiddlyFox%20Apocalypse.html

#12

You beat me to it, Tones

#13

That’s possible with my file-backups AddOn for FireFox.

There is a small issue though. FireFox only allows AddOns to save to the browser Downloads directory or a subdirectory automatically. So you need to load your single file wikis from there.

For me that’s not a problem. I do have a “spare disc” F: which I did set as the browser downloads directory. So I basically I can save back to any directory on F: … My wiki folder is F:\wikis\ … and the root dir contains the download content. … That’s works perfectly fine.

Also see: File Backup Utility For TiddlyWiki | file-backups

have fun!

#14

Hi @chebyshev you have come at this question with a strange perspective but I see now that is because we still mention the TiddlyFox apocalypse in the documentation. Your memories from five years ago was of a difficult transition but it is all over now (for some years).

First this has being solved for a long time, I suggest Installing Timimi addon and host component and it works on FireFox, Chrome and Edge at least. I use this every day and its even better than the old TiddlyFox, but it is the closest thing available to the old TiddlyFox, however there are many other save options available like Marios.

Second, The so called “TiddlyFox apocalypse” actually proved we had a very strong community and perhaps even grew our community much stronger. It’s background was it was when the increasing security across all browsers threatened to disallow autosave to local files from the browser.

The saving mechanism’s have continued to evolve since back then and we have more choice and functionality than ever.

#15

Thanks for the suggestions! Indeed it seems I am a bit behind the times. However, I just installed Timimi on both Firefox and Chrome, and was unable to get it to work on either. Maybe I’m missing something obvious, but it does not seem to save changes automatically like I gather it’s supposed to. In Firefox, I tried making a new test tiddler, which causes the “Save changes” (checkmark in circle button) on the right side pane to turn red, indicating there are unsaved changes. When I hit the confirm changes button for the tiddler, the red checkmark in circle button on the right changes to black color, suggesting that the changes have been autosaved. But in fact the changes are not saved (the local file on my computer is not altered). Timimi is definitely doing something, because when I disable it the red checkmark in circle button does not turn black as described above when timimi is enabled.

Even though I would I like to get this to work with the somewhat older version of TiddlyWiki that I am primarily using, I tested the above both with that version and with the current version – same problem for both. I am using the current version of Firefox (v. 100) on a fairly recent MacBook Pro.

Thanks for any help!

#16

Look here Timimi — One saver to rule them all to see if that helps.
If not - please start a new thread - this is about Changing font size.
Please explain what you have done already.

#17

As @Birthe said but keep in mind Timimi demands a component be installed “once” on your operating system, the Browser plugins/addons then communicate with this component to save locally.

Once done for all your browsers you can almost forget about it.

I get a new file each time I save, what am I doing wrong?
#18

I had forgotten to install the additional component for Timimi (in retrospect this should have been obvious given the browser security changes; it makes me a bit uncomfortable installing something that seems to basically bypass the security features, but I suppose that is the price to pay).

Anyways, the whole thing now works well for me! Since I can now just use Command-+ to increase the font size in Firefox, the goal of changing font size with the browser rather than as part of tiddlywiki code has been achieved.

Thanks for the patient help!

#19

That is understandable.

Keep in mind this is also the process of recovering features taken by security changes, If you look at “Progressive Web Apps” PWA’s they are already using similar mechanism’s. It is OK to save and interact with the local device, it just needs to be secure so third parties can’t do things secretly. We must also keeping mind the user doing something foolishly and hackers using “Social engineering” to make us do things we should not.

We need to remain vigilant.

#20

Sorry for necroing the thread. I haven’t found any other more current thread on this matter. There is a related issue on GitHub (lack of zooming functionality in TD): Provide page zoom feature · Issue #30 · TiddlyWiki/TiddlyDesktop · GitHub.

I have created a tweak that binds keyboard shortcuts ctrl/cmd shift +/-/0 to pseudo zoom in/out/reset zoom in TiddlyDesktop. It works by changing the px sizes as defined in vanilla theme tweaks.

I found this way of zooming to look more seamless than the code by Eric Shulman posted above.
It has the same limitations of not working with fixed px sized elements, but it works well enough for me on small zoom levels.

See it at https://wilk-tweaks.tiddlyhost.com (or permalink to demo of this pseudo zoom).
I have tested it only on TiddlyDesktop and Firefox on Windows so far, so let me know if there are any issues on other platforms, particularly with key bindings.

1 Like