How to inject some html to my tiddlywiki without changing the theme?

#1

I just want to import a font from google fonts because couldn’t use the base64 css font embed trick, also @import in stylesheets doesn’t work.

My guess is that because @import must be at the start of stylesheet document but stylesheet tiddlers get merged by some internal functionality or just something causes the @import s to not be on the start.

Importing fonts by html works, I’ve tested it on a tiddler, the problem is the font is applied to my wiki until the tiddler is open so it goes away as soon as I close the tiddler.

I want to inject the html so it always stays there, independent of a tiddler being open or close, if possible without changing the theme so I can update tiddlywiki and themes easily.

If are curious or need the html, there it is:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Vazirmatn:wght@100..900&display=swap" rel="stylesheet">
<style>
* {
  font-family: Vazirmatn;
}
</style>

I expected this to not work, because it needs to be in head. But it works.

Where could I find answer of this the tiddly wiki docs? I searched for it but the keywords I expected and searched for didn’t give me the results I like.

#2

Place the HTML syntax into a tiddler tagged with $:/tags/RawMarkup. Using this tag causes the tiddler’s content to be “included as raw markup at the bottom of the <head> section in the generated HTML file.”

IMPORTANT: “Note that the wiki must be saved and reloaded in order for a raw markup tiddler to take effect.”

enjoy,
-e

2 Likes
#3

Thanks a lot! It worked. To know about and get the hang of stuff like this stuff, what would be better? Asking it here in forums or just reading the whole reference and docs once?