Link to a section in another tiddler

#1

Hi all,

What is the idiomatic way (if any) to link to a specific paragraph from another tiddler ? (like in Obsidian).

Even if you extract the paragraph in it’s own tiddler and link to it, you can’t see it in the original context (let’s say the middle of a larger tiddler).

I’m aware of anchor links but they are only for linking within the same tiddler. Why can’t they work across different tiddlers?

Thank you.

1 Like
#2

This is because anchor links are a html feature while a link to another tiddler is handled by the javascript engine of tiddlywiki. Linking to a header is not supported by tiddlywiki “vanilla”, and probably wont ever be, however it should be possible to emulate this with a macro or a template.

Here’s an example to get you started :

\define linkto(tiddler,id,text)
<$button class="tc-btn-invisible tc-tiddlylink">
<$text text={{{[[$text$]]~[[$tiddler$]]}}}/>
<$action-navigate $to="$tiddler$" $scroll="no"/>
<$action-sendmessage $message="tm-scroll" selector="#$id$" animationDuration="1000"/>
</$button>
\end

Usage:

<<linkto "Your Tiddler" "your-anchor" "Custom text">>

In the tiddler “Your Tiddler”

<a id="your-anchor"/>

Alternative with a nicer syntax (In a tiddler with the $:/tags/Macro tag ) :

\define #(link,animationDuration:"1000")
<$let
separator="|"
tiddler={{{ [<__link__>split<separator>nth[1]] }}}
text={{{ [<__link__>split<separator>nth[2]] }}}
selector={{{ #[<__link__>split<separator>nth[3]]+[join[]] }}}
>
<$button class="tc-btn-invisible tc-tiddlylink" tooltip="click once to open, twice to navigate to the section">
<$text text={{{[<text>!is[blank]else<tiddler>]}}}/>
<$action-navigate $to=<<tiddler>> $scroll="no"/>
<$action-sendmessage $message="tm-scroll" selector=<<selector>> animationDuration="$animationDuration$"/>
</$button>
</$let>
\end
\define a(anchor,element:"a") <$element$ id="$anchor$"></$element$>
Usage:

<<# "Your Tiddler|Custom text|your-anchor">>
<<a "your-anchor">>

Clicking the button once will open the tiddler, then clicking again will scroll to the anchor in the tiddler. To open AND scroll to the tiddler in one click I think you will need to use javascript :

https://tiddlywiki.com/#WidgetMessage%3A%20tm-navigate

2 Likes
#3

I presume you have reviewed the following? Anchor Links using HTML

There has being a lot of water under the bridge on this subject.

From my perspective the key issue with anchors is having unique ID’s or selectors. This is easy on standard HTML sites as it tends to be a HTML page at a time however you can can have hundreds of tiddlers and which ones are visible at any time means unique automated heading anchors within tiddlers are not easy.

  • However if you are happy to code manual unique ids’ for your anchors/headings in tiddlers it’s fine.
  • As @telumire demonstrates you may need to open the tiddler first
  • Note tiddlywiki co-opts the URL “#anchor” mechanism to open tiddlers.
  • I suggest a table of contents at the top of large tiddlers with the links to parts within it. Then use a permalink to get to the tiddler.
  • We may be able to co-opt the URL search parameter - but a warning “it breaks Timimi at the moment”.
#4

Thanks for highlighting that useful bit of functionality - I think I will try and keep a note of that one.

<$action-sendmessage $message="tm-scroll" selector="#$id$" animationDuration="1000"/>
#5

For people care about block level linking, please review this PR: Feat: allow link to section mark by linonetwo · Pull Request #7744 · Jermolene/TiddlyWiki5 · GitHub

Is xxx xxx ^id and [[Link to ID|SomeTitle^id]] a good syntax that you like?

Currently you need to manually add the id. We need to decide the syntax before add feature support to editors, where we might be able to auto create the id when create a link.

5 Likes