Is there a way to make the transclude collapse?

#1

I need to collapse the transclude to title and also expand back.

https://tiddlytools.com/#NestedSlidersPlugin I found this link, but I don’t know how to install it. And seems it was a little old.

Any way to to this?

#2

Hi Ori

That plugin is for Tiddlywiki classic, not TW5.
I’m not sure how to do what you want! Sorry.

Ste

#3

Look at Shiraz, display on demand!
You have two options: slider and details!

There are several examples out there!

Also you may be interested in $details plugin from Thomas Elmiger!

3 Likes
#4

Try The Subsume Plugin — Turn links into sliders!. It is a plugin that wraps a transclusion with a details element (slider), and places a button to edit the tiddler next to the header.

2 Likes
#5

Great Tool thank you .

#6

While all of the suggested solutions are useful, I find it preferable to keep the number of 3rd-party addons to a minimum. To that end, here’s some wiki code that only uses standard TWCore widgets to implement a “slider”:

\define slider(tid)
<$vars state=<<qualify "$:/state/slider/$tid$">>>
<$list filter="[<state>is[missing]]" variable="show_contents">
   <$button class="tc-btn-invisible" style="text-align:left;">
      <$transclude tiddler="$tid$" mode="block"/>
      <$action-setfield $tiddler=<<state>> text="hide"/>
   </$button>
</$list>
<$list filter="[<state>is[tiddler]]" variable="show_title">
   <$button class="tc-btn-invisible" style="text-align:left;">
     <$text text="$tid$"/> {{$:/core/images/chevron-right}}
      <$action-deletetiddler $tiddler=<<state>>/>
   </$button>
</$list>
</$vars>
\end

Notes:

  1. The expanded/collapsed state of each “slider” is stored in a system tiddler whose title is constructed from the title of the tiddler being transcluded, with “$:/state/slider/” as a prefix, and a system-generated “qualify” value as a suffix. Note that the “qualify” macro ensures that if the same slider is rendered in more than one tiddler, each instance will have a distinct state tiddler, allowing them to expand/collapse separately.

  2. The contents of the first $list are displayed when the state tiddler is missing (the default/initial condition). The contents of the second $list are displayed when the state tiddler exists.

  3. Each $list shows a $button, using class="tc-btn-invisible" style="text-align:left;" so that the button appears as normal inline text, rather than an actual pushbutton.

  4. The first $button transcludes the specified tiddler, using mode="block" so that paragraphs and other “block mode” content (e.g., tables, bullet lists, etc.) are rendered normally. The transclusion is followed by an action that creates the state tiddler by setting it’s text to “hide”, which triggers a refresh that causes the second $list to be displayed instead of the first $list. The effect is that clicking anywhere within the transcluded content will hide that content.

  5. The second $button shows just the title of the transclusion, followed by a double right arrow (“chevron-right”) to indicate that there is hidden content. The title and arrow are followed by an action that deletes the state tiddler, which triggers a refresh that re-displays the contents of the first $list, so that the transclusion is once again shown.

  6. The slider code is contained within a macro definition so that it can be invoked via: <<slider TiddlerTitleHere>>. If you place the macro definition in a separate tiddler (e.g. “MySliderMacro”) tagged with $:/tags/Macro, it is defined as a “global macro” that can then be used in other tiddlers.

enjoy,
-e

4 Likes
#8

Great work, thank you.