Displaying images in tiddlers based on tiddler's title

#1

I’d like to show an external (local) picture inside a tiddler via ViewTemplate.
The picture name is to be taken from the tiddler name automatically when the tiddler is displayed. So if the tiddler is called “piccone” it should show the picture of the same name “piccone.png” stored in a directory (/itadeu/piccone.png) The file path works when inserted manually.

I did this tagged with $:/tags/ViewTemplate:

<$list filter="[is[current]tag[sostantivi]]">

<$set name="imgTitle" value=<<currentTiddler>>>
  <$set name="imgSrc" value="/itadeu/{{!!title}}.png">
    <p>debug path: <<imgSrc>></p>
    <img src=<<imgSrc>> width="100" alt=<<imgTitle>> />
  </$set>
</$set>

</$list>

But it does not work. I get the correct file path to the picture like this:

debug path: /itadeu/picture.png

And then the broken image link (icon) with the correct caption (“piccone”).

It seems like I can’t get the correct syntax for the src=“…” from the set/variables. What am I doing wrong here? How to read the filename correctly into the img src line?

#2

You can use the syntax shown here: https://tiddlywiki.com/#Substituted%20Attribute%20Values, ie

value=`/itadeu/$(currentTiddler)$.png`
#3

Thank you for trying to help, but it does not seem to change anything… I did this if that’s what you have suggested:

<$list filter="[is[current]tag[sostantivi]]">

<$set name="imgTitle" value=<<currentTiddler>>>
  <$set name="imgSrc" value=`/itadeu/$(currentTiddler)$.png`>
    <p>debug path: <<imgSrc>></p>
    <img src=<<imgSrc>> width="100" alt=<<imgTitle>> />
  </$set>
</$set>

</$list>

The debug path is correct but the picture is not displayed… Maybe the scr= needs its content in quotes… but alt= takes the variable directly and displays it correctly. Thanks anyway.

AS

#4

the path to the image needs to be a url. maybe

value=`file:///itadeu/$(currentTiddler)$.png`

you can type the url into the browser address bar to ensure that the path is correct.

1 Like
#5

Excellent, it’s working… I appreciate your help. Thank you,

AS

1 Like