TW5: auto color background of transcluded text

151 views
Skip to first unread message

Chuck R.

unread,
Dec 23, 2019, 9:44:24 AM12/23/19
to TiddlyWiki
My system: TW5.1.19 on tiddlyspot.com, I use the latest Chrome version to get to the wiki

When I transclude text I'd like to make the background color different. But I don't want to use this every time:
@@background-color:yellow;
{{tiddler1}}
@@


because that's a manual process. I'd like a visual indicator of transcluded text so I don't have to go into edit mode of a tiddler to see what is transcluded and what is not.

I have looked around in the TW5 help and I only saw reference to the inline CSS style above.

Let's say I have "tiddler1" which will be transcluded into "tiddler2". So in "tiddler2" I would write:
{{tiddler1}}

Is there a CSS class I can use to automatically color all transcluded text without having to manually style every time I do a transclusion? Or is there another way to do this?

If we don't have a CSS class for transcluded text can we get one in a future release?

Thank you!

Chuck R.

unread,
Dec 23, 2019, 9:46:44 AM12/23/19
to TiddlyWiki
If a new CSS class is added in the future just for transcluded text then it looks like the TranscludeWidget would also have to be updated.

Eric Shulman

unread,
Dec 23, 2019, 10:18:33 AM12/23/19
to TiddlyWiki
On Monday, December 23, 2019 at 6:44:24 AM UTC-8, Chuck R. wrote:
When I transclude text I'd like to make the background color different. But I don't want to use this every time:
@@background-color:yellow;
{{tiddler1}}
@@

You could write a macro that wraps the transclusion in a color, and then use that macro instead of direct transclusion:

\define transclude(what) @@background-color:yellow;{{$what$}}@@

and then invoke it like this:
<<transclude tiddlername>>
<
<transclude tiddlername||templatename>>
<
<transclude tiddlername!!fieldname>>
<
<transclude !!fieldname>>
etc.

While this wouldn't cover ALL possible uses of transclusion
(e.g., <$transclude tiddler=<<variablename>> />),
it would certainly help with the most common use-cases.

-e



Diego Mesa

unread,
Dec 23, 2019, 11:14:10 AM12/23/19
to TiddlyWiki
Only slightly related but I always like to recommend Tobias' "inc" plugin:


which "Enhance transclusion by including tiddlers with an on-hover toolbar". 

I think it should be part of the core. 

Chuck R.

unread,
Dec 23, 2019, 11:30:01 AM12/23/19
to TiddlyWiki
Thanks Eric, I will look into making a macro since I haven't made one before.

Chuck R.

unread,
Dec 23, 2019, 11:39:43 AM12/23/19
to TiddlyWiki
Hmm, it does not seem to be working. The transcluded tiddler doesn't appear at all now, in the other tiddler that contains it. I just enter my \define into a normal tiddler and it's a global macro right? This is what I entered in a new tiddler:
\define colortransclude(tiddler)
@@background-color:gray;{{$tiddler$}}@@
\end


My tiddler to transclude has a space in the name so I did the transclude like this:
<<colortransclude "Study utilities">>






On Monday, December 23, 2019 at 10:18:33 AM UTC-5, Eric Shulman wrote:

Chuck R.

unread,
Dec 23, 2019, 11:42:43 AM12/23/19
to TiddlyWiki
Ok I had to give my tiddler that defined the macro a tag of "$:/tags/Macro". It works now.
Message has been deleted

Mohammad

unread,
Dec 23, 2019, 12:35:41 PM12/23/19
to TiddlyWiki
Use Shiraz: https://kookma.github.io/Shiraz/

It has a plenty of panels, alert and textbox for such things!

Good luck
--Mohammad

TiddlyTweeter

unread,
Dec 23, 2019, 12:43:13 PM12/23/19
to TiddlyWiki
Chuck R. wrote:
Ok I had to give my tiddler that defined the macro a tag of "$:/tags/Macro". It works now.

Right!

Understanding "scope" of apply in TW is critical. This is not just on macros.

Given TW is fragments then "apply" of macro, css etc needs to be similarly specific.

Going global need that extra step you took on macro to eat the whole tamoli.

It took me yonks to understand that.

TT

Chuck R.

unread,
Dec 23, 2019, 2:23:12 PM12/23/19
to TiddlyWiki
The macro is now working but TW is not rendering the header in the transcluded text correctly. Header is formatted like "! Header". So when "Study utilities" is transcluded into "Study main" the header in "Study utilities" is not rendered at all. It just appears as wiki text. This is what I see now in "Study main" for the transcluded text using that macro for coloring transclusions:
! Tools to download Pubmed references # Texmed: Download Pubmed references in Bibtex format. https://www.bioinformatics.org/texmed/ # Forum post: Generate Bibtex file from PMIDs. 2001. https://www.biostars.org/p/14051/ # Pubmed guide to downloading references. https://guides.lib.unc.edu/endnote-references


I posted an image but the post was deleted.

Could this be a bug?

How am I supposed to show what is happening if I can't post an image?

Chuck R.

unread,
Dec 23, 2019, 2:29:31 PM12/23/19
to TiddlyWiki
If I define my macro like this:
\define colortransclude(tiddler)
@@background-color:#e0e0e0;
{{$tiddler$}}
@@
\end

The gray background no longer shows up at all.


If I define my macro like this:
\define colortransclude(tiddler)
@@background-color:#e0e0e0;{{$tiddler$}}@@
\end

The header element is not rendered as a header, nor are the list elements rendered as a list.

Eric Shulman

unread,
Dec 23, 2019, 3:23:39 PM12/23/19
to TiddlyWiki
On Monday, December 23, 2019 at 11:23:12 AM UTC-8, Chuck R. wrote:
I posted an image but the post was deleted. 

That post was flagged for moderation (but I don't know why). 

I *approved* the posting (from the moderator controls), but then it says it was deleted instead of appearing.

I've seen that happen before... and I think it's a GoogleGroups "bug".

In any event... let's try to solve your problem, even without a picture.

see my reply in another post.

-e

Eric Shulman

unread,
Dec 23, 2019, 3:54:40 PM12/23/19
to TiddlyWiki
I think you are running into the difference between "inline" rendering and "block" rendering.

Normally, HTML and TW content is rendered "inline", which means that even if the text is
entered with embedded newlines, it is joined together so that it automatically fills each
line before wrapping to the next.  Most of the time, this is what you want.

However, certain TW syntax is really intended to always start on a fresh line.  To signal that,
the TW parser looks for a blank line immediately before the content.  That means at least
TWO newlines entered into the source content: one to end the previous line, and another
to leave a blank.

Headings, block quotes and bullet lists work like this.  Thus, if you type any of these:
Some text here
! I want a heading
Stuff below the heading

Some text here
* I want a bullet item
Stuff below the bullet

Some text here
<<<
I want a block quote
<<<
Stuff below the block quote

They don't work as you might expect, and the "!", "*" and "<<<" syntax all appear inline, like this:
Some text here ! I want a heading Stuff below the heading

Some text here * I want a bullet item Stuff below the bullet

Some text here <<< I want a block quote <<< Stuff below the block quote

To get the results you want, you have to precede the start of each of those formats with a blank line, like this:
Some text here

! I want a heading
Stuff below the heading

Some text here

* I want a bullet item
Stuff below the bullet

Some text here

<<<
I want a block quote
<<<
Stuff below the block quote

When a tiddler is rendered by itself (i.e., not in a transclusion), it automatically
starts out in "block" mode, even though there is no newline at the start of the content.
However, when that same content is transcluded, the "block" vs "inline" handling
depends on where the transclusion occurs.

If you put a blank line before the transclusion in your macro, like this:
\define colortransclude(tiddler)
@@background-color:#e0e0e0;

{{$tiddler$}}
@@
\end

It should fix the problem.   BUT... that is a bit obscure of a solution,
since it depends on using whitespace, which doesn't *seem* like
real content.

Fortunately, there is another way to do the transclusion.

If you use the *widget* syntax for transclusion, you can specify an
additional parameter that FORCES it to use block mode rendering: 
<$transclude tiddler="TiddlerName" mode="block" />

Using this syntax, you don't need to put embedded newlines in your macro

\define colortransclude(tiddler)
@@background-color:#e0e0e0;<$transclude tiddler={{$tiddler$}} mode="block" />@@
\end

You could also reduce this further to a "one line macro",
where the content is on the same line as the "\define"
and doesn't even need the closing "\end", like this:
\define colortransclude(tiddler) @@background-color:#e0e0e0;<$transclude tiddler={{$tiddler$}} mode="block" />@@

Any of the above solutions *should* give you the results you wanted.

Let me know how it goes...

enjoy,
-e

TonyM

unread,
Dec 23, 2019, 6:14:32 PM12/23/19
to TiddlyWiki
Chuck et al..

Extending some transclusion and template play I have being doing recently I thought would would be a good method, 

Create a colorme tiddler no tags needed perhaps use the system prefix $:/
<section style="background-color:#e0e0e0;"><$transclude tiddler=<<currentTiddler>> mode="block" /></section>

Now rather than use a regular transclude use
{{HelloThere||colorme}}

This is using colorme as the template to display the "text field" of what you transclude.

Advanced
This makes use of the currentTiddler coming from the value where I placed HelloThere. If you want to reference (in the template colorme) the actual tiddlers name in which 
{{HelloThere||colorme}}
was placed.
you can use the variable 
<<storyTiddler>>

For Hackers
I observe that 
{{HelloThere!!description}}
will display description from the HellowThere tiddler
but
{{HelloThere!!description||colorme}}
will not

I understand why and can see the view widget may resolve coloring a text reference ie tiddler!!field
My Question however is how can I access the name of the field in the text reference in the colorme template (if at all)?

Regards
Tony

Chuck R.

unread,
Dec 28, 2019, 8:47:00 AM12/28/19
to TiddlyWiki


On Monday, December 23, 2019 at 3:54:40 PM UTC-5, Eric Shulman wrote:

The "Study utilities" tiddler doesn't get transcluded at all now. My macro is this:
\define colortransclude(tiddler)
@@background-color:"silver";<$transclude tiddler={{$tiddler$}} mode="block" />@@
\end


And I call the macro like this to transclude the tiddler:
<<colortransclude "Study utilities">>


Ton Gerner

unread,
Dec 28, 2019, 9:10:04 AM12/28/19
to TiddlyWiki
Hi Chuck,

\define colortransclude(tiddler)
@@background-color:"silver";<$transclude tiddler={{$tiddler$}} mode="block" />@@
\end


And I call the macro like this to transclude the tiddler:
<<colortransclude "Study utilities">>

 
Try

\define colortransclude(tiddler)
@@background-color:"silver";<$transclude tiddler="$tiddler$" mode="block" />@@
\end


Hope that helps.

Cheers,

Ton

Eric Shulman

unread,
Dec 28, 2019, 9:18:58 AM12/28/19
to TiddlyWiki
On Saturday, December 28, 2019 at 5:47:00 AM UTC-8, Chuck R. wrote:
The "Study utilities" tiddler doesn't get transcluded at all now. My macro is this: 
\define colortransclude(tiddler)
@@background-color:"silver";<$transclude tiddler={{$tiddler$}} mode="block" />@@
\end

And I call the macro like this to transclude the tiddler:
<<colortransclude "Study utilities">>

Apologies!  When I wrote the post, I replaced the {{$tiddler$}} syntax with an explicit <$transclude> widget...

BUT... I didn't change the {{...}} usage into a *simple text string* parameter, e.g., tiddler="$tiddler$"

Ton Gerner's followup post shows the correct syntax to use.

-e



Ton Gerner

unread,
Dec 28, 2019, 9:26:14 AM12/28/19
to TiddlyWiki
Hi Chuck,

One other thing I overlooked:

@@background-color:"silver";

must be:

@@background-color:silver;

Cheers,

Ton

Julio Peña

unread,
Dec 28, 2019, 11:15:45 AM12/28/19
to TiddlyWiki
Hello all,

I tried Ton's and Eric's suggestions and all I get is the transcluded tiddler without the background color.
I did a little experiment at Tiddlywiki.com and this is what I got:

color-trans.png


For some odd reason the background color does not render.

Best regards,

Julio

Chuck R.

unread,
Dec 28, 2019, 12:31:11 PM12/28/19
to TiddlyWiki
Sorry all, this just isn't changing the background color. I wonder if the 'colortransclude' CSS gets overridden because it appears too early in the order of CSS rendering. I've also tried defining the macro with and without double quotes around the $tiddler$ variable and nothing works.

The CSS in the 'colortransclude' macro should be the last CSS applied to make sure that CSS overrides all other CSS in TW5.

So this macro works, but just doesn't change the background color of the transcluded text.
\define colortransclude(tiddler)
@@background-color:silver;<$transclude tiddler="$tiddler$" mode="block" />@@
\end




On Saturday, December 28, 2019 at 9:10:04 AM UTC-5, Ton Gerner wrote:
Hi Chuck,


 

Chuck R.

unread,
Dec 28, 2019, 12:32:56 PM12/28/19
to TiddlyWiki
If I define the macro like this:
\define colortransclude(tiddler)
@@background-color:silver;font-weight:bold;<$transclude tiddler="$tiddler$" mode="block" />@@
\end


The font-weight and font color is changed, but not the background color when the text is transcluded. So the CSS from the custom macro 'colortransclude' is working, except for the background-color.

Chuck R.

unread,
Dec 28, 2019, 12:39:41 PM12/28/19
to TiddlyWiki
I also made another custom macro 'colormediv' where I used <section> and <div> tags (separately) and neither worked to change the background color.

\define colortransclude(tiddler)
<section style="background-color:#e0e0e0;">

<$transclude tiddler=$tiddler$ mode="block" />
</section>
\end



I've also saved the TW5, and reloaded it from the TW5 sidebar to no effect. It seems it is not possible to change the background-color at all using any method.

What a challenge!

Wait. I just removed the space from my tiddler to transclude so the tiddler title is not "Studyutilities" and this worked to change the background color.
\define colortransdiv(tiddler)
<div style="background-color:#e0e0e0;">

<$transclude tiddler=$tiddler$ mode="block" />
</div>
\end


Very odd!


Ton Gerner

unread,
Dec 28, 2019, 1:21:55 PM12/28/19
to TiddlyWiki
Hi,

If I do write the macro as:

\define colortransclude(tiddler)
@@background-color:yellow;<$transclude tiddler="$tiddler$" mode=block/>@@
\end

it does not work. But if I do write the macro as

\define colortransclude(tiddler)
@@background-color:yellow;
<$transclude tiddler="$tiddler$" mode=block/>@@
\end

it works.

Cheers,

Ton


Chuck R.

unread,
Jan 4, 2020, 1:08:12 PM1/4/20
to TiddlyWiki
This works, even with tiddlers with a space in the name. Thanks!

Mohammad Rahmani

unread,
Jan 4, 2020, 1:30:07 PM1/4/20
to tiddl...@googlegroups.com
Shiraz plugin has some tools for easy creating content with customizable background!
So, have a look at Shiraz a small CSS framework based on Bootstrap 4.1



Best wishes
Mohammad


--
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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/a907f484-48ec-43e5-9534-65eaa3f742fc%40googlegroups.com.
Reply all
Reply to author
Forward
0 new messages