TW5 include external js/css in meta area

782 views
Skip to first unread message

Felix Küppers

unread,
May 20, 2014, 8:56:09 AM5/20/14
to tiddl...@googlegroups.com
Hi,

I want to include my external library in TW5, however, everytime I save TW, it overrides my script reference in the html code.

the code is inserted by me manually inside the <head> tag

<script src="js/jquery-1.9.1.js" type="text/javascript"></script>
<script src="js/my.js" type="text/javascript"></script>
<link href="css/my.css" rel="stylesheet" type="text/css" />

...

any ideas how to solve it?
many thanks!

Stephan Hradek

unread,
May 20, 2014, 9:21:52 AM5/20/14
to tiddl...@googlegroups.com
Can't you put it into a tiddler?

http://tiddlywiki.com/#Using%20Stylesheets:[[Using%20Stylesheets]]

For JavaScript I suggest to create a plugin or macro. jQuery I wouldn't include like that. I think it will lead to problems in the long run, but @Jeremy or @Mario could answer this better I think.

BJ

unread,
May 20, 2014, 11:53:54 AM5/20/14
to tiddl...@googlegroups.com
to include code (ie your script references etc) in the header section, put the code into a tiddler and tag it with $:/core/wiki/rawmarkup.
cheers

BJ

Felix Küppers

unread,
May 20, 2014, 4:20:42 PM5/20/14
to tiddl...@googlegroups.com
Thanks, that did the job!

Also thanks @stephan for the advice.

felix

Jeremy Ruston

unread,
May 26, 2014, 5:51:16 PM5/26/14
to TiddlyWiki
Hi BJ

to include code (ie your script references etc) in the header section, put the code into a tiddler and tag it with $:/core/wiki/rawmarkup.

Well spotted, I think that I had forgotten that feature. For 5.0.13, I've added support and documentation for $:/tags/RawMarkup alongside $:/core/wiki/rawmarkup; we'll deprecate the latter at some point.


Many thanks

Jeremy




--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/d/optout.



--
Jeremy Ruston
mailto:jeremy...@gmail.com

Danielo Rodríguez

unread,
May 27, 2014, 6:24:34 AM5/27/14
to tiddl...@googlegroups.com
Wow, how many hidden features.

Talking about including documentation... Jeremy, I saw that you have included more addons in the Codemirror plugin. Would you consider explaining how to use them? I know how, but maybe not the average user.

Regards

Jeremy Ruston

unread,
May 27, 2014, 2:13:03 PM5/27/14
to TiddlyWiki
Hi Danielo

Talking about including documentation... Jeremy, I saw that you have included more addons in the Codemirror plugin. Would you consider explaining how to use them? I know how, but maybe not the average user.

I'm actually not really familiar with CodeMirror myself; I just lashed up the initial plugin wrapper. I'd welcome documentation contributions on this.

Best wishes

Jeremy.

 

Regards


--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
For more options, visit https://groups.google.com/d/optout.

Jan Johannpeter

unread,
Dec 5, 2014, 7:16:56 PM12/5/14
to tiddl...@googlegroups.com
Am 20.05.2014 17:53, schrieb BJ:
to include code (ie your script references etc) in the header section, put the code into a tiddler and tag it with $:/core/wiki/rawmarkup.
cheers

BJ
Hi,
Thanks for the Trick, this seems to be very practical.
is there a similar one for TiddlyWikiClassic? And would it work with the jquery.js

many thanks Jan



On Tuesday, May 20, 2014 1:56:09 PM UTC+1, Felix Küppers wrote:
Hi,

I want to include my external library in TW5, however, everytime I save TW, it overrides my script reference in the html code.

the code is inserted by me manually inside the <head> tag

<script src="js/jquery-1.9.1.js" type="text/javascript"></script>
<script src="js/my.js" type="text/javascript"></script>
<link href="css/my.css" rel="stylesheet" type="text/css" />

...

any ideas how to solve it?
many thanks!

BJ

unread,
Dec 5, 2014, 10:22:52 PM12/5/14
to tiddl...@googlegroups.com
Hi Jan,
in classic there are shadow tiddlers - MarkupPreHead and MarkupPostHead. Note that jquery is already include in classic tiddlywiki

cheers

BJ

Jan Johannpeter

unread,
Dec 7, 2014, 6:40:57 AM12/7/14
to tiddl...@googlegroups.com
Hi BJ,
It is good news to read that jquery is already included.
My purpose ist to add a menu called mmenu to my TWC because I want to use on a cellphone.
I would like to include another .js and a stylesheet.
<head>
   <script src="path/to/jquery.js" type="text/javascript"></script>
   <script src="path/to/jquery.mmenu.min.all.js" type="text/javascript"></script>
   <link href="path/to/jquery.mmenu.all.css" type="text/css" rel="stylesheet" />
 </head>

see http://mmenu.frebsite.nl/tutorial/
I guess the css can be simply merged into the central stylesheet.
Is it possible to add the jquery.mmenu.min.all.js within a tiddler.

Thanks Jan

Tobias Beer

unread,
Dec 7, 2014, 3:43:42 PM12/7/14
to tiddl...@googlegroups.com
Hi Jan,
 

Nice, looks like a real nice ui for a mobile tw.

I guess the css can be simply merged into the central stylesheet.

Best create a tiddler for it...

[[jquery.mmenu.all.css]]

and put a reference like the above at the end of your StyleSheet tiddler.
I would put adjustments / overrides into yet another tiddler,
referenced behind the one from the distro:

[[jquery.mmenu.custom.css]]

For an example, see (bottom) of http://white.tiddlyspace.com/#StyleSheet. 
 
Is it possible to add the jquery.mmenu.min.all.js within a tiddler.

Try putting it into a tiddler tagged systemConfig and see if it works.

Perhaps you don't have to /want to try and run it on document.ready();

Otherwise, you may need to reference it from MarkupPreHead

Best wishes, Tobias.

Tobias Beer

unread,
Dec 7, 2014, 4:22:08 PM12/7/14
to tiddl...@googlegroups.com

Here's he thing though: it looks mobile-ish on a desktop but when I open it in chrome on a 4s, ios 8, I see no responsive mobile site. What's worse, the thing crashes as soon as I try to navigate to places.


At least in Safari, it doesn't do the crashing.

Best wishes, Tobias. 

Jan Johannpeter

unread,
Dec 7, 2014, 5:37:03 PM12/7/14
to tiddl...@googlegroups.com
Hi Tobi, (so happy you're back!)
The tutorial doesn't seem to work, indeed.
The other examples on http://mmenu.frebsite.nl  (and http://mmenu.frebsite.nl/examples.html) seem to work better, though the scaling in the original css is far from perfect. I think I will have to do some viewport trick in the css to make it really look like an app.
I will try your aproach, it would be fascinating if it worked.

Thanks a lot.
Jan

Danielo Rodríguez

unread,
Dec 7, 2014, 6:55:34 PM12/7/14
to tiddl...@googlegroups.com
The provided examples are very similar to what I was thinking about for TW5. But I think there is no need of external libraries, most of this can be achieved with CSS and TW5 core.

Tobias Beer

unread,
Dec 7, 2014, 7:12:12 PM12/7/14
to tiddl...@googlegroups.com
My purpose ist to add a menu called mmenu to my TWC...

By the way... was that a typo?

Best wishes, Tobias. 

Jan Johannpeter

unread,
Dec 8, 2014, 2:58:10 PM12/8/14
to tiddl...@googlegroups.com
Hi!
Great. You can't imagine how happy this prospect makes me. I made a an attempt, but its far beyond my skills.
Yours Jan

Jan Johannpeter

unread,
Dec 8, 2014, 3:05:54 PM12/8/14
to tiddl...@googlegroups.com
Hi Tobias.
Oh Sorry I saw you were quoting me. No it is no typo, I am still working with TWC. (Should I absolutely migrate? I thought one day there might be a better automation for migration. )

Jan

Am 08.12.2014 01:12, schrieb Tobias Beer:

Jan Johannpeter

unread,
Dec 9, 2014, 6:21:10 AM12/9/14
to tiddl...@googlegroups.com
Hello,
I am trying to integrate mmenu into my TWC (mmenu is a menu which has
some features very practical for mobile use:SwipeMenu,
DrillDownNavigation > http://mmenu.frebsite.nl/).
I made an attempt but I don't know how to make the javascript work inline.
My attempt with an index of the involved Tiddlers can be downloaded
here: https://www.dropbox.com/s/2e48roo9coxv13g/mmenutest.html?dl=0.
Perhaps someone can help me...
Thanks a lot Jan


Reply all
Reply to author
Forward
0 new messages