[TW5] Use image gallery as list of links?

[Tom Bardout]

Hi, 

Is there a way to turn the code used here to display links to other tiddlers as images?

It would be great to also have the title of the linked tiddler under each image. 

For now, this is what I have but it doesn't display a thing and if it did, I suppose it wouldn't be in picture form...

<div class="my-gallery">

<$list filter="[all[tiddlers][field:parent<currentTiddler>] +[sort[title]]]">

<span title=<$link><<currentTiddler>>

<$transclude/>

</span>

</$list>

</div>

[Mark S.]

There were several errors in the filter. But that's all right -- I made several errors trying to fix it. It's easy to mess up, especially when you're counting braces. Also, I'm pretty sure you can't put a widget into the middle of a span tag, but if you could it would have to be closed (<$link/>).

The <$link> needs to be wrapped around whatever you want to link to. Here's what I came up with:

<div class="my-gallery">
<$list filter="[all[tiddlers]field:parent<currentTiddler>

] +[sort[title]]">
<span title=<<currentTiddler>>>
<$link><$transclude/></$link>
</span>
</$list>
</div>

HTH
Mark

[Tom Bardout]

Thanks Mark,

Unfortunately, it doesn't display anything either :/

Since my tiddlers are not photos, they won't display. I wish to have tiddlers with a picture field linking to an external image.

Take a look at my setup:

http://test00000.tiddlyspot.com/

[Mark S.]

There are different approaches. The transclusion widget transcludes the text field by default or an image if it is defined with _canonical_uri. Using _canonical_uri, you can use an external image as though it were local in the TW.

The filter syntax expects to find a match for any tiddler whose parent field contains the same name as the current tiddler. Since you don't have a $:/structurestab field that was a non-starter. If I changed tiddler 1, putting "$:/structurestab" into the "parent" field, and copying and pasting the contents of the picture field into a _canonical_uri field, and changing the type of the tiddler to image/png, then this code seems to work:

<div class="my-gallery">
<$list filter="[all[tiddlers]field:parent<currentTiddler>] +[sort[title]]">
<span title=<<currentTiddler>>>

<a target="_blank" href={{!!_canonical_uri}}><$transclude/></a>
</span>
</$list>
</div>

I used a standard anchor to create the external reference. It might have been possible to use [ext[]] syntax, but I knew this would work so went with it.

HTH
Mark

[Tom Bardout]

Hi Mark,

I've followed all your instructions but I'm unable to replicate your results.

I think you might not understand where i'm going with this. This is my goal:
 
I don't wish to put $:/structurestab in the parent field since $:/structurestab is a transclussion and thus appears as a tab underneath each tiddler. <currentTiddler> is supposed to look at the main tiddler $:/structuretab. $:/structuretab will apply to all tiddlers making an automatic list of links to elements "tagged" to current tiddler.
I wish to do this with a lot of fields and a lot of data and cannot use tags since I already use them for other purposes.

Tom


[Mark S.]

Ok. Get rid of _canonical_uri and reset the tiddlers to the standard tiddler format. Then try this for $:/structuretab

@@text-align:left;
''Structures''

<div class="my-gallery">
<$list filter="[all[tiddlers]field:parent<currentTiddler>] +[sort[title]]">
<span title=<<currentTiddler>>>

<$link><img src={{!!picture}}/></$link>
</span>
</$list>
</div>

 When I used this, I could click on tiddler "1" and see tiddlers "2" and "2bis" as images under the structure tab. Clicking on one of the tiddler images takes you to that tiddler.

HTH
Mark

[Tom Bardout]

Thanks a lot Mark. That did the trick.
I'm now trying to get them to go go side by side and display a title underneath to have nice intuitive navigation