clickable picture that opens a link?

2,283 views
Skip to first unread message

Luc@TW

unread,
Jul 16, 2015, 8:23:20 AM7/16/15
to tiddl...@googlegroups.com
Hi

I am relatively new in this TiddlyWiki world - and the Classic <> TW5 differences.
I am now trying to have pictures that are also a link in TW5.

So, do I understand it right that the (easy) syntax
[img[alternate text|displayed image source][link]] 
only works in TW Classic?

On the other hand, using full html, like:
<a href="http://hubblesite.org/newscenter/archive/releases/1998/18/image/b/format/large_web/">
[img  width=300px tooltip="""SPACE!!""" [http://imgsrc.hubblesite.org/hu/db/images/hs-1998-18-b-small_web.jpg]]
</a>
opens the link in the same (Firefox) browser window as the originating TiddlyWiki, so going 'back' afterwards, leads back to the begin of that TiddlyWiki, and not back to the tiddler where you came from.

 So what is the simpliest way to have this basic function of a picture working as a link in TW5?

Thanks a lot for your feedback on this
Luc

Sylvain Naudin

unread,
Jul 16, 2015, 12:46:24 PM7/16/15
to tiddl...@googlegroups.com
Hi,

I think you can read this : http://tiddlywiki.com/#ExternalImages

If your image is already online, you can use the _canonical_uri field to store an external image as a tiddler.


(edit : but I don't answer your question..)

Eric Shulman

unread,
Jul 16, 2015, 12:59:06 PM7/16/15
to tiddl...@googlegroups.com
On Thursday, July 16, 2015 at 5:23:20 AM UTC-7, Luc@TW wrote:
[img  width=300px tooltip="""SPACE!!""" [http://imgsrc.hubblesite.org/hu/db/images/hs-1998-18-b-small_web.jpg]]
</a>
opens the link in the same (Firefox) browser window as the originating TiddlyWiki, so going 'back' afterwards, leads back to the begin of that TiddlyWiki, and not back to the tiddler where you came from.

add target="_blank" to the <a> syntax.  This will ensure that the external link opens in another window/tab.

-e

Jed Carty

unread,
Jul 16, 2015, 1:26:18 PM7/16/15
to tiddl...@googlegroups.com
I do not think that there is simple syntax like in classic, the easiest way I know is using the link widget, which is the equivalent of using html a tags for internal links. Something like this should work:

<$link to=TiddlerName>[img[alt textIimageTiddler]]</$link>

As an example, putting

<$link to=HelloThere>[img[This is alt text|Motovun Jack.jpg]]</$link>

into tiddlywiki.com will display the image of Motovun Jack that acts as a wikilink to the tiddler HelloThere.
Motovun Jack.jpg is the name of a tiddler that contains the image, not the path to the image. You can put a path to an image there but you need the whole path starting with http:// or file:// depending on if it is online or a local image.

Jed Carty

unread,
Jul 16, 2015, 1:30:03 PM7/16/15
to tiddl...@googlegroups.com
And the back behavior you are talking about is set in the control panel. Under the settings tab in the $:/ControlPanel tiddler there is a heading Navigation Address Bar, under that check 'Include the target tiddler' and the back button should do what you want it to do.

Eric Shulman

unread,
Jul 16, 2015, 3:38:40 PM7/16/15
to tiddl...@googlegroups.com
On Thursday, July 16, 2015 at 10:26:18 AM UTC-7, Jed Carty wrote:
I do not think that there is simple syntax like in classic, the easiest way I know is using the link widget, which is the equivalent of using html a tags for internal links. Something like this should work:

<$link to=TiddlerName>[img[alt textIimageTiddler]]</$link>

Although that will work for linking images to tiddlers (i.e., "internal" links), the $link widget doesn't support external links to URLs.  For that, you need to use an HTML link:
   <a href="..." target="_blank"> [img[...]] </a>

-e

Luc@TW

unread,
Jul 16, 2015, 4:03:01 PM7/16/15
to tiddl...@googlegroups.com
OK, thank you: with this target="_blank" addition, the back behaviour now works like I wanted!
This works for me!

Luc@TW

unread,
Jul 16, 2015, 4:50:07 PM7/16/15
to tiddl...@googlegroups.com
But now I already struggle with a new 'problem': my 'portrait' pictures are displayed in landscape mode.... If I click the link, they are displayed correctly, but the 'thumbnail' picture in the TiddlyWiki is displayed in landscape instead of portrait...
I apologise if this also some basic parameter I should set...
I already tried to add height=... but (of course) this simply deforms and does not rotate 90° in the right direction...
Thanks for some more advice on this!

Luc@TW

unread,
Jul 16, 2015, 5:05:12 PM7/16/15
to tiddl...@googlegroups.com
OK, I noticed now that these pictures that are displayed in portrait in my Mac, were displayed in landscape orientation in my PC (what else would you expect ;-)
So I rotated them 90° in my PC (which apparently didn't have any effect yet) and then I rotated them 4x 90° in my Mac, and now they are displayed OK in my TiddlyWiki!
So this problem is also 'solved' :-)

Jeremy Ruston

unread,
Jul 17, 2015, 11:12:20 AM7/17/15
to TiddlyWiki
Hi Luc

You've stumbled across a peculiarity of JPEG images: the format allows for a simplified way to rotate an image through 90 degrees just by setting a flag that says "rotate me before viewing". The feature is designed to make it easier for digital cameras to rotate images correctly. However, many JPEG viewers in practice ignore the flag. So, if you have any such images you need to convert them to properly rotate the image.

There's a lot more detail here if you're interested:


Best wishes

Jeremy.



--
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 post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/dc9f3d29-59dc-4140-ae87-576dd02dbaff%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.



--
Jeremy Ruston
mailto:jeremy...@gmail.com
Reply all
Reply to author
Forward
0 new messages