Image and Media & Text blocks: Use LinkControl

[richtabor]

Part of #50891

As part of the effort to consolidate the link application experience across the editor #50891, let's use LinkControl to apply links to the core/image and core/media-text blocks as well. It may be useful to have LinkControl depict what controls render when in a media context (like these two blocks).

Tasks

• Implement LinkControl within the Image block.
• Implement LinkControl within the Media & Text block.
• Add a method for LinkControl to render media-specific actions at the foot (above "Add new page").
• Do not render "Text" input field when in media-specific context.
• Add support for "Class" input field in the link settings drawer when in media-specific context (supporting existing feature-set).

Visual

Current	Proposed

[getdave]

I'd love to see if we could utilise the rich preview idea to display a preview of the media you've selected if it is an image. That's a stretch goal though...

[carolinan]

Do not render "Text" input field when in media-specific context.

What does this text input field do?
Because linked images need to have a link text, and usually this is the alt text, so it is visually hidden.
But the link text needs to be editable because it describes the link target, not the image.

[richtabor]

What does this text input field do?

There’s not one. Text field is for the copy that the link is applied to.

[afercia]

Re: @carolinan's point: see also #50950 (comment)

[getdave]

Adding a setting to control the alt text is a good idea. I'm assuming however, that we'll want this to be one of the "primary" fields shown next to the URL field rather than hidden in the settings? I ask because I'll likely be implementing it and I want to consider how I architect this.

[richtabor]

I'm not sure about a manually input alt text field that overrides the image's alt text field (something to explore a bit more on though). But I do think we could perhaps auto-apply an alt text for the attachment page or image file link options (if there is no alt text for the image) as suggested here: #50950 (comment)

That's interesting. It would be nice to auto-set the Image block's alt text if "Link to attachment page", or Link to image file" options were selected. Would be a nice follow-up to explore.

[getdave]

I don't think this will land in 6.4.

[richtabor]

I don't think this will land in 6.4.

Agreed. Punted.

[afercia]

Adding a setting to control the alt text is a good idea. I'm assuming however, that we'll want this to be one of the "primary" fields shown next to the URL field rather than hidden in the settings?

The alt text is the actual text content. As such, it should be in a prominent spot in the UI. In the core media grid, we moced the Alternative Text field to the top since a while, because it's the most important field.

I'm not sure about a manually input alt text field that overrides the image's alt text field (

That's what WordPress does everywhere iwth alt text since ages. Always provide users with the ability to adapt the alt text to the specific usage in the current context.

But I do think we could perhaps auto-apply an alt text for the attachment page or image file link options (if there is no alt text for the image) as suggested here: #50950 (comment)

I don;t think I'm actually suggesting to auto-apply an alt text in that comment? What I pointed out there is that when an image is linked, the alt text must describe the link purpose / destination. Often, the alt text saved in the media gallery only describes the image content, which would be inappropriate for a link.

That's interesting. It would be nice to auto-set the Image block's alt text if "Link to attachment page", or Link to image file" options were selected. Would be a nice follow-up to explore.

Not sure that would work appropriately. For example:

• I add an image to a normal post, and I link the image to its attachment page. It's a link so the alt text must describe the link destination or purpose.Something like: Go to the White Unicorn image details page.
• When in the attachment page, the auto-set alt text would still be Go to the White Unicorn image details page, which is clearly wrong.

Unfortunately, WordPress foesn't provide the ability to set multiple atl text to be used in different context, so far. There have been some discussions in that regatd but no actual action plan. For this reason, I'd think the beast option for now is to always provide users with the ability to set the alt text manually.

Cc @joedolson @alexstine for any welcome additional thoughs.

[richtabor]

In the core media grid, we moced the Alternative Text field to the top since a while, because it's the most important field.

What's this?

For clarity, I was referring to the alt text on the link itself, which we do not currently support (image, nor the media-text block), not the image's alt text.

[carolinan]

There seems to be some confusion about the link text for linked images, where the image is the only element inside the link.

I was referring to the alt text on the link itself,

A link, an <a> element, can not have an alt attribute, it is not valid HTML.
If the image has an alt attribute, the alt attribute is the accessible name.
If the link has an aria-label, the aria-label is the accessible name, not the alt.

[carolinan]

Besides linking to the image media file and attachment page, the media & text block needs to be able to link to the current post in a query loop when the featured image is used.

It can be useful to always be able to link to the current post when inside a query loop, not only for the media blocks, so I think this should be added as an option.