Relative Links in Image Widget

[kcrnc]

When using the image widget and adding a custom URL, I noticed that relative links are not supported.

Adding a relative link to the widget result in an error being shown(red highlighted box) and then the widget doesn't save.

I think this may be a feature not a bug, but I can think of a few times when you might want to be able to put a link there without including the 'http' or 'https.'

Like if you want to add an anchor instead of a link, like #some_div

or if you want the link to work regardless of whether HTTP or HTTPS is being used.

[kcrnc]

So, for example:

Working: https://core.trac.wordpress.org/ticket/42740
Not Working: /ticket/42740
Not Working: #header_nav

[westonruter]

Good observation. It's because we're using an HTML5 url field here. We should change it to allow for partial URLs. We can incorporate the same logic as done in #42506.

[audrasjb]

working text input for custom image link in image widget

[audrasjb]

EDIT: Ok didn't saw @westonruter previous answer, but I guess my small patch is still relevant as it seems to be the same observation.

Hi @kcrnc

I reproduced your issue. It's due to the url html5 field.
Here is a (very) small patch, transforming url input into text input. We don't need url field, I guess, as other link fields already uses text field as well in WP core.
I tested it and it's fine with this patch.

Cheers,
Jb

[audrasjb]

Ok, I looked into #42506 and my patch was a way too simple. It doesn’t include any regex to check the string.
I guess we need other pieces of code here :)
I can try to apply #42506 checks but I never been very comfortable with regex.

[westonruter]

The regular expression from [42154] could just be added as a pattern attribute for the input that you changed from url to text.

[westonruter]

In particular, the value of the pattern attribute I think should be:

((\w+:)?\/\/\w.*|\w+:(?!\/\/$)|\/|\?|#).*

[audrasjb]

Wow. Thanks @westonruter for this great hint!
I used the pattern found in this file.

[audrasjb]

Add a great URL pattern which allows relative URLS.

[dd32]

Bumping to 4.9.3 due to 4.9.2s release

[afercia]

Terminology notes:

"relative vs absolute"
URLs without the protocol part or without the domain name are still "absolute" if they don't depend on the context, for example:
/somepath/somefile
//mysite.com/somepath/somefile
are absolute URLs

Only URLs that depend on context, i.e. the location of the document they're used into, are "relative" for example:
somepath/somefile
../somefile

[kcrnc]

@afercia

I believe it is a fairly common usage.

It wouldn't be relative on a file system, but is relative to the URL or protocol.

Googling 'relative vs absolute paths' and 'relative vs absolute urls' provides various definitions supporting both uses.

[afercia]

@kcrnc I wouldn't recommend Googling :) Instead, I'd recommend specifications or authoritative sources:
​https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_is_a_URL

I know it's common usage, but it's just a common mistake.

[kcrnc]

@afercia

'google' or a search engine, is a good starting point for finding authoritative sources and you can find plenty to support both.

While I like mozilla a lot, the source you provided is user edited and I don't see any sources on that page.

Here is an article from google using the alternate syntax: ​https://support.google.com/analytics/answer/2664470?hl=en

Here is a memo from 1995 that describes the alternate use as well: ​https://tools.ietf.org/html/rfc1808

"The syntax for relative URLs is a shortened form of that for absolute URLs [2], where some prefix of the URL is missing and certain path components ("." and "..") have a special meaning"

The scheme is described later on in the spec and this is referenced here: ​https://tools.ietf.org/html/rfc2616

[westonruter]

In 42533:

Widgets: Allow relative/partial URLs in Image Widget's link field.

Props audrasjb.
Amends [41252].
See #41274.
Fixes #42740.

[westonruter]

In 42534:

Widgets: Allow relative/partial URLs in Image Widget's link field.

Props audrasjb.
Amends [41252].
See #41274.
Fixes #42740 for 4.9 branch.