How to include external js and css files?

#1

Hi,

TiddlyWiki is a very good application. I like use it to document everything.

I want more cool interface and rich features.

Can TW include external js and css files?

like sorttable.js, richcolor.css, etc…to globale range.

I know that opening TW with a text editor can be included in < head > Tags using < link > and < script >.

but I think…maybe has other simple ways?

Computational notebooks in TW
#2

You could do either linkage to external or directly embed the code in TW.

Since TW is an environment that monitors itself there are a few rules on all this to master first.

TT

1 Like
#3

I try to directly embed the code in Tiddler.

<link type="text/css" rel="stylesheet" href="mystyle.css" />
<script type="text/javascript" src="myscript.js"></script>

Its works, but when I close the Tiddler, the style effection will be cancel.

And if every Tiddlers embed same code, the script will be execute many times.

TW has any external sources manager?

I want to load these css and js files to globale range for once on TW startup.

#4

So, you need to get them invoked globally on startup? … Read this about how to get the basic directives needed into the HTML page head to do that …

https://tiddlywiki.com/#SystemTag%3A%20%24%3A%2Ftags%2FRawMarkup

The code you’d enter is exactly the same as if you were entering it in a page header. In TW we do this through tagged tiddlers ($:/tags/RawMarkup) rather than messing with the actual page.

I hope this clear!, TT

3 Likes
#5

And of course introducing css is trivial, put your CSS in a tiddler and tagged with $:/tags/Stylesheet and you can check the order here Control Panel > Info > Advanced > Stylesheets.

Of course then you want to apply the css and use it depends on precisely what you want it to do.

1 Like