How to change the font of a single tiddler
28 views
Skip to first unread message
sb56637
Sep 16, 2008, 1:16:18 PM9/16/08
to TiddlyWiki
Hi,
I have a single tiddler for which I want to change the font of the
entire tiddler. Is this possible?
Thanks!
I have a single tiddler for which I want to change the font of the
entire tiddler. Is this possible?
Thanks!
Eric Shulman
Sep 16, 2008, 1:31:01 PM9/16/08
to TiddlyWiki
> I have a single tiddler for which I want to change the font of the
> entire tiddler. Is this possible?
When a tiddler is displayed into the story column, the DOM element
> entire tiddler. Is this possible?
that contains the rendered tiddler has an ID="tiddler"+TiddlerName.
Thus, for a tiddler named [[XYZ]], you can write the following in your
[[StyleSheet]]:
#tiddlerXYZ {
font-family: ...
font-weight: ...
font-style: ...
etc.
}
enjoy,
-e
Eric Shulman
TiddlyTools / ELS Design Studios
sb56637
Sep 16, 2008, 1:39:26 PM9/16/08
to TiddlyWiki
Thanks for the reply!
And is there by any chance a way to do this with inline CSS styles in
the tiddler body?
And is there by any chance a way to do this with inline CSS styles in
the tiddler body?
FND
Sep 16, 2008, 1:43:47 PM9/16/08
to Tiddl...@googlegroups.com
> is there by any chance a way to do this with inline CSS styles in
> the tiddler body?
> the tiddler body?
Yes, by embedding raw HTML:
<html>
<style type="text/css">
#tiddlerMyTiddler { ... }
</style>
</html>
There's also a page on the community wiki:
http://www.tiddlywiki.org/wiki/Tiddler-Specific_Styles
That also explains how to access tiddlers whose title contains spaces.
-- F.
Eric Shulman
Sep 16, 2008, 1:47:07 PM9/16/08
to TiddlyWiki
> And is there by any chance a way to do this with inline CSS styles in
> the tiddler body?
@@font-family:"fontname";
> the tiddler body?
your content here
@@
-e
sb56637
Sep 16, 2008, 1:55:18 PM9/16/08
to TiddlyWiki
Thank you all!
@@font-family:"fontname";
your content here
@@
This works well, just what I was looking for.
@@font-family:"fontname";
your content here
@@
Morris Gray
Sep 16, 2008, 8:00:36 PM9/16/08
to TiddlyWiki
On Sep 17, 3:43 am, FND <F...@gmx.net> wrote:
> Yes, by embedding raw HTML:
> <html>
> <style type="text/css">
> #tiddlerMyTiddler { ... }
> </style>
> </html>
I can't seem to make this work. If this is meant to actually modify
> Yes, by embedding raw HTML:
> <html>
> <style type="text/css">
> #tiddlerMyTiddler { ... }
> </style>
> </html>
MyTiddler I must be doing something wrong.
Also I've tried this from http://www.tiddlywiki.org/wiki/Tiddler-Specific_Styles
with no success either
<html>
<style type="text/css">
.className {
font-size: 1.2em;
}
</style>
</html>
I kind of remember that someone once said <style type="text/css">
doesn't work in TiddlyWiki only <script> does. Of course I'm not
always up to date on the latest core changes. I tried <style> also
with no success. I wonder what I'm doing wrong.
Morris
FND
Sep 17, 2008, 3:18:58 AM9/17/08
to Tiddl...@googlegroups.com
> I can't seem to make this work.
Works fine for me:
http://fnd.lewcid.org/tmp/tiddlerCSS.html
> I kind of remember that someone once said <style type="text/css">
> doesn't work in TiddlyWiki only <script> does.
It's the other way around; SCRIPT tags don't work (unless you're using
Eric's InlineJavaScriptPlugin, of course), but STYLE tags are just fine.
-- F.
Morris Gray
Sep 17, 2008, 4:23:31 AM9/17/08
to TiddlyWiki
Thanks FND for going to the trouble of creating working examples for
me. I found the problem. It appears it was the HTMLFormattingPlugin
was preventing it from working. I downloaded the latest version just
to make sure my slightly out of date version wasn't the problem.
Morris
.
me. I found the problem. It appears it was the HTMLFormattingPlugin
was preventing it from working. I downloaded the latest version just
to make sure my slightly out of date version wasn't the problem.
Morris
.
Eric Shulman
Sep 17, 2008, 8:22:19 AM9/17/08
to TiddlyWiki
> Thanks FND for going to the trouble of creating working examples for
> me. I found the problem. It appears it was the HTMLFormattingPlugin
> was preventing it from working. I downloaded the latest version just
> to make sure my slightly out of date version wasn't the problem.
By default, HTMLFormattingPlugin, retains embedded newlines in the
> me. I found the problem. It appears it was the HTMLFormattingPlugin
> was preventing it from working. I downloaded the latest version just
> to make sure my slightly out of date version wasn't the problem.
content so that mixed HTML and wiki syntax can be correctly rendered.
However, when you are using HTMLFormattingPlugin to render purely non-
wiki HTML/CSS syntax, you should include a special bit of plugin-
defined psuedo-HTML syntax, "<hide linebreaks>"
When this pseudo-HTML is present anywhere inside the enclosing
<html>...</html> markers, it tells the plugin to ignore embedded
newlines in the HTML/CSS content, so that it will be parsed as 'pure'
HTML instead of 'mixed HTML and wiki syntax'.
<html><hide linebreaks> ... HTML content ... </html>
For additional info, please see the "line breaks" section of the
plugin documentation:
http://www.tiddlytools.com/#HTMLFormattingPluginInfo
Morris Gray
Sep 17, 2008, 9:35:34 AM9/17/08
to TiddlyWiki
> However, when you are using HTMLFormattingPlugin to render purely non-
> wiki HTML/CSS syntax, you should include a special bit of plugin- defined
> psuedo-HTML syntax, "<hide linebreaks>"
I've made this omission several times in my life. I am a heavy user of
> wiki HTML/CSS syntax, you should include a special bit of plugin- defined
> psuedo-HTML syntax, "<hide linebreaks>"
html in tiddlers so some time ago I made a new tiddler template for
html containing <html><hide linebreaks> ... </html> I can hardly bear
to see <html> without the hide linebreaks with it :-) However I must
have found another way to muck it up because this is the code I am
using and it still doesn't work.
<html><hide linebreaks>
<style type="text/css">
#tiddlerFoo {
color: #f00;
}
#tiddlerBar\000020Baz {
color: #0f0;
}
.tiddler {
border: 2px solid #aaa;
margin-bottom: 5px;
padding-bottom: 5px;
}
</style>
</html>
I downloaded FND's example TW 2.4.1 and a new HTMLFormattingPlugin so
I wouldn't have anything else to interfere. I've tried it over and
over first disabling HTMLFormattingPlugin and the code works then
enabling the plugin and it stops working. I don't know what to try
next. Maybe you can spot an error I can't see.
Morris
Eric Shulman
Sep 19, 2008, 6:23:08 PM9/19/08
to TiddlyWiki
> <html><hide linebreaks>
> <style type="text/css">
> ...
> <style type="text/css">
> </style>
> </html>
>
> I downloaded FND's example TW 2.4.1 and a new HTMLFormattingPlugin so
> I wouldn't have anything else to interfere. I've tried it over and
> over first disabling HTMLFormattingPlugin and the code works then
> enabling the plugin and it stops working.
Eeek! A bug! A sneaky, subtle, deep-DOM, "look at the nodes one at a
> </html>
>
> I downloaded FND's example TW 2.4.1 and a new HTMLFormattingPlugin so
> I wouldn't have anything else to interfere. I've tried it over and
> over first disabling HTMLFormattingPlugin and the code works then
> enabling the plugin and it stops working.
time to figure it out" type bug...
... which turned out to be simply that HTMLFormattingPlugin was
attempting to wikify the #text nodes containing the CSS style
definitions, which introduced an extra <span>...</span> container
inside the <style>...</style> block, thereby invalidating the style
declarations, resulting in no net change in appearances.
I've fixed the problem (basically, the plugin now simply leaves the
inner content of the <style>...</style> block alone, so that the
browser will still handle the CSS properly).
Get the update (V2.2.0) here:
http://www.TiddlyTools.com/#HTMLFormattingPlugin
Reply all
Reply to author
Forward
0 new messages