How to create an external link from field (that opens in a new tab)?

423 views
Skip to first unread message

Joe Black

unread,
Jul 10, 2020, 2:57:29 PM7/10/20
to TiddlyWiki
I am creating a bookmark-button. On clicking the button, I create a new Tiddler with a field: website.When the field contain a link, I want to show the link and an icon for the corresponding site. I got everything but the links working.

This is where I am stuck: If the field is empty, nothing shows (Correct). If the field has text, it shows an icon, a label, and two links.

The first link doesn't work. It opens a new tab (correct) and says: "Your file was not found

It may have been moved or deleted. ERR_FILE_NOT_FOUND"



The second link works, but it opens in the current window. This is problematic, because I use TiddlyDesktop. There is no back-button, so I have to restart the whole program.


This is my code:
<$list filter="[all[current]has:field:[website]]">
   [img width=22 [icon-website.svg]]
   <$view field="website"/>

   [ext[Website|{{!!website}}]]
   
<a href={{!!website}} rel="noopener noreferrer">Website</a>

</$list>


I couldn't find anything besides those two ways to create an external link. Any help would be appreciated. Maybe the problem is TiddlyDesktop (and external links handling)?

J.

Sidenote: I just started with TW a few days ago, but based on my fun-metric of browser-tabs-opened/hour it ranks very high.

Birthe C

unread,
Jul 10, 2020, 3:40:53 PM7/10/20
to TiddlyWiki
I have not tried it using TidldyDesktop, but you could try: <a href={{!!website}} target="_blank">Website</a>

Birthe

Joe Black

unread,
Jul 10, 2020, 3:51:34 PM7/10/20
to TiddlyWiki
That actually worked! Very nice, thank you :)

(So I had to look outside of TW and look up regular HTML-resources?)

Eric Shulman

unread,
Jul 10, 2020, 3:56:11 PM7/10/20
to tiddl...@googlegroups.com
On Friday, July 10, 2020 at 11:57:29 AM UTC-7, Joe Black wrote:
The first link doesn't work. It opens a new tab (correct) and says: "Your file was not found

It may have been moved or deleted. ERR_FILE_NOT_FOUND"


The second link works, but it opens in the current window. This is problematic, because I use TiddlyDesktop. There is no back-button, so I have to restart the whole program.

<$list filter="[all[current]has:field:[website]]">

   [img width=22 [icon-website.svg]]
   <$view field="website"/>
   [ext[Website|{{!!website}}]]
   
<a href={{!!website}} rel="noopener noreferrer">Website</a>
</$list>


In the first case (the [ext[...]] syntax), you can't put wiki syntax (the {{!!website}}) *inside* the brackets.
The result is a link to literally "{{!!website}}" rather than the value stored in that field.  Also,
by default, the [ext[...]] syntax always open a new tab.  Thus, the the new tab opens but
reports the error "Your file was not found 

It may have been moved or deleted. ERR_FILE_NOT_FOUND"


In the second case (the <a href=...> stuff), that is standard HTML enhanced with TiddlyWiki TWCore code that
*does* permit use of {{...}} to fetch the value stored in a field and use it as an HTML parameter.  The only thing
you're missing is the target="_blank" param that forces the link to open in a new tab (as Birthe has already
pointed out).

-e

Joe Black

unread,
Jul 10, 2020, 4:29:46 PM7/10/20
to TiddlyWiki
Thank you for the in-depth explanation.

I got one last question. Do I need the "rel="noopener noreferrer"? The wiki mentions that it is used to maintain the privacy of the URL (sounds important), but Birthe posted the link without it.

Eric Shulman

unread,
Jul 10, 2020, 5:04:31 PM7/10/20
to TiddlyWiki
On Friday, July 10, 2020 at 1:29:46 PM UTC-7, Joe Black wrote:
Thank you for the in-depth explanation.

I got one last question. Do I need the "rel="noopener noreferrer"? The wiki mentions that it is used to maintain the privacy of the URL (sounds important), but Birthe posted the link without it.

It's not strictly necessary but it can't hurt.  In general, if you are working from a locally stored TiddlyWiki, then the referrer value is, by default, blocked from being shared, as that could expose information about the folder structure of your local hard drive.

Otherwise, it really depends on the external URL you are going to, and how paranoid you are.  If a site "harvests" the referrer value, it lets them know info about the URL you came from, and they can use the referrer value to tailor the content they display or gather statistics to help in their business plannning.  For example, if you click on a banner ad, they can look at the referrer to know which site you came from.  This can help them tune their advertising expenses by knowing which sites produced the most effective ad placements.

-e

TW Tones

unread,
Jul 10, 2020, 6:05:50 PM7/10/20
to TiddlyWiki
Joe,

I will just add the target can be used to open multiple links in the same tab, saving the creation of too many tabs. Say I have a set of links to material in google forums, if I set the target in tiddlywiki to target="twforums" every link using this target will open in the same tab. Replacing the previous one. this is standard html behaviour, but a useful one.

Regards
Tony

TW Tones

unread,
Jul 10, 2020, 6:10:02 PM7/10/20
to TiddlyWiki
Eric,

I was aware of this but your restating it makes me wonder if our own tiddlywikis could detect the referrer, or is this only a server feature?, I am thinking of of this for two reasons;
  • In my own internal wikis identify the source that opened the wiki
  • On a hosted wiki I have a method where the wiki reloads itself via a link, I would like to detect when this happens rather when someone first lands on the sight.
  • I only want this for sources I control, not for harvesting anything.
Regards
Tony
Reply all
Reply to author
Forward
0 new messages