I’ve been able to follow the instructions from the 2nd link pretty easily. I’ve been able to create tiddlers with single colors, change their opacity, and add background images from an external URL. One thing that is eluding me though, is how to add a background image from an an image that already exists in the wiki. For instance, I have a tiddler named image.png that is of type “image/png”. When I use “background-image: url(./image.png);” in my stylesheet, it doesn’t show up in the background of the test tiddler I want to apply it to. If I change the source to the URL of an image I see on the internet, it shows up just fine.
You need to transclude the tiddler image as an URI in your css (or even better if it’s a png, place your image in the same folder and use the url of your file). You can use the datauri macro if you want to use an image encoded in your wiki, see https://tiddlywiki.com/#datauri%20Macro%20(Examples).
If you use an external, local image dont forget to add quotes to avoid escaping issues : url() - CSS: Cascading Style Sheets | MDN
1 Like