Skip to content

[HelpHub][7.0]: Link control validation #2255

Closed

Description

@andreawetzel

Article: https://wordpress.org/documentation/article/link-editing/

Update for 7.0

  • Add URL validation in LinkControl using ValidatedInputControl 73486

General

  • Make sure all screenshots are relevant to the latest version
  • Make sure videos, if any, are up to date
  • Add ALT tags for the images
  • Make sure the headings are in sentence case
  • Convert all reusable blocks to a ‘regular block’.
  • Update the changelog at the end of the article
Directions (click to open)
  • Compare existing screenshots (on the article link) to the actual interface in the latest WordPress version.
  • Ensure you have the appropriate WordPress version and that new screenshots cover the same page area as the existing one.
  • If something is different in the latest version, make a new screenshot.
  • Upload new screenshots to the comment on this issue.
  • Request review by stating in the comment that the issue is ready for review.
Notes (click to open)
  1. You can set WordPress install in one click by visiting https://playground.wordpress.net/ or use InstaWP sandbox https://app.instawp.io/onboard
  2. We are not adding detailed updates for the Block settings - Typography, Color, Layout, Dimension and Border and for the More Options setting in the block toolbar. Pls mention the settings included for the block and link to the detailed settings pages instead.
  3. Some of the PRs have great videos that can be added to the article.
Automation (click to open)

If you want, you can assign yourself to the issue and change the label for review by posting specific keywords in a comment:

  • Assign yourself: /assign
  • Request review: /review

Read about our repo's automatisation here.

Activity

  1. github-actions commented on Apr 21, 2026

    @github-actions

    Heads up @WordPress/docs-issues-coordinators, we have a new issue open. Time to use 'em labels.

  2. kedarjoyner commented on May 19, 2026

    @kedarjoyner
    Collaborator

    /assign

  3. github-actions commented on May 19, 2026

    @github-actions

    Hey @kedarjoyner, thanks for your interest in this issue! 🍪🍪🍪
    If you have any questions, do not hesitate to ask them in our #docs Slack channel.
    Enjoy and happy contributing ❤️

  4. kedarjoyner commented on May 19, 2026

    @kedarjoyner
    Collaborator

    Proposed changes include updating the Adding a link section to:

    1. Shorten content to be more concise
    2. Add a new section title "Invalid URLs"
    3. Include two additional screenshots to show the link icon in the block toolbar and link validation

    Content before changes

    First, insert a hyperlink with the link icon. You can also use the Ctrl+K (or ⌘+K) keyboard shortcut.

    Clicking on the link icon will open a dialog box.

    You can type in the URL of the page you want to link to.

    You can also use the Search text box to search for pages on your own website. If you start typing a keyword into the Search text box, WordPress will list content titles on your website that match the keyword. This is helpful for on-site link building.

    [Embedded video]

    Tip: If you already have the URL of the website you want to link to in the clipboard, highlight the text, you want to make into a link and use Ctrl+V (or ⌘+V) to add the hyperlink to the text.

    Content after changes

    Highlight the text you want to link. Select the link icon in the block toolbar. This opens a dialog box where you can search for pages on your own website or type a URL.

    Image alt text: Link icon selected in the Paragraph block showing URL options

    Link icon selected in the Paragraph block showing URL options

    Alternatively, you can use the Ctrl+K (or ⌘+K) keyboard shortcut to quickly add a link rather than clicking the link icon.

    The Search option allows you to select pages on your website you want to link to. Start typing a keyword to view a list of content on your website that match.

    [Embedded video]

    Tip: If you copied the URL of the website you want to link to, you can highlight the text and use the Ctrl+V (or ⌘+V) keyboard shortcut to link the text.

    Invalid URLs

    Image alt text: "The link text 'Hello, world!' is shown as the link URL with an error message to please add a valid URL"

    The link text 'Hello, world!' is shown as the link URL with an error message to please add a valid URL

    When adding a link, WordPress may ask you to “Please enter a valid URL” if the link looks incomplete or malformed. This helps prevent broken links from being saved.

    Use one of these formats:

    • Full URL: https://wordpress.org
    • Same-page anchor link: #contact
    • Relative links: /about or ../documents/file-name, which points to a page or file based on its location in the site.

    For external links, include the full address with https://.

    Note: WordPress checks whether the link is formatted like a valid URL. It does not confirm that the destination page exists or loads successfully.

  5. github-actions commented on May 19, 2026

    @github-actions

    Heads up @docs-reviewers - the "[Status] Review" label was applied to this issue.

  6. andreawetzel commented on May 19, 2026

    @andreawetzel
    CollaboratorAuthor

    LGTM 🚀

  7. moved this from Todo to Needs 1st Review in WordPress 7.0 Documentationon May 19, 2026
  8. kedarjoyner commented on May 19, 2026

    @kedarjoyner
    Collaborator

    I've published these changes and added to the Needs 1st Review column

  9. AbayomiOye commented on Jun 4, 2026

    @AbayomiOye

    /assign

  10. github-actions commented on Jun 4, 2026

    @github-actions

    Hey @AbayomiOye, this issue is already assigned to @kedarjoyner.
    A maintainer can also add you to the list of assignees or swap you with the current assignee. Or you can take a look at other unassigned issues we have.

  11. AbayomiOye commented on Jun 4, 2026

    @AbayomiOye

    Reviewing

  12. AbayomiOye commented on Jun 4, 2026

    @AbayomiOye

    In the docs, I will add this

    Image

    So it shows that we can edit the link. The link preview is functional (although it can be improved a bit The Links control could be improved by showing a richer preview of the page or URL a link points to. In addition to displaying the link itself, the preview could include useful destination details such as the page title, site name, content type, favicon, internal or external status, and a small visual thumbnail or snapshot where available.

    For internal links, WordPress could generate this preview from existing site data, such as the page title, featured image, post type, and permalink. For external links, the preview could use available metadata such as the page title, description, favicon, and Open Graph image.

    A visual snapshot would make it easier for users to confirm that they are linking to the correct destination before publishing. This would be especially useful on larger websites where multiple pages may have similar names or URLs.

    To avoid performance and privacy concerns, the visual snapshot could be optional, cached, or only loaded when the user expands the link preview.)

    Also, this

    The current Links control documentation explains how to add and edit links, but a few areas could be made clearer for users who are new to the block editor.

    The documentation could be improved by adding short explanations for the following:

    1. What the Links control does

    The introduction should clearly explain that the Links control allows users to add, edit, search for, and configure links inside supported blocks. This helps users understand the purpose of the feature before following the steps.

    1. The difference between hyperlinks and embeds

    The documentation should explain that adding a link to selected text is different from pasting a URL on its own line. When a URL is pasted on its own line, WordPress may create an Embed block with a preview. However, when text is highlighted and linked, WordPress creates a normal hyperlink.

    1. Accepted link formats

    The valid URL section could include more examples of supported link types, such as:

    https://wordpress.org

    /about

    #contact

    mailto:name@example.com

    tel:+123456789

    This would help users understand that links are not limited to normal website URLs.

    1. What the URL validation actually checks

    The documentation should explain that WordPress checks whether the URL format looks valid, but it does not confirm that the destination page exists or loads successfully.

    1. What “Open in new tab” means

    The documentation should explain that turning on this option opens the link in a new browser tab, while leaving it off opens the link in the same tab.

    1. What “nofollow” means

    The documentation should briefly explain that the nofollow option tells search engines not to pass ranking value through the link. This is useful for paid, sponsored, user-submitted, or untrusted links.

    1. Internal and external links

    The documentation could explain the difference between linking to content on the same website and linking to an outside website. This would help users understand when to use site search and when to enter a full external URL.

    1. Link settings across different blocks

    The documentation could mention that link settings may appear slightly differently depending on the block being used, such as Paragraph, Button, Image, or Navigation blocks.

  13. kedarjoyner commented on Jun 13, 2026

    @kedarjoyner
    Collaborator

    In the docs, I will add this

    Image So it shows that we can edit the link. The link preview is functional (although it can be improved a bit The Links control could be improved by showing a richer preview of the page or URL a link points to. In addition to displaying the link itself, the preview could include useful destination details such as the page title, site name, content type, favicon, internal or external status, and a small visual thumbnail or snapshot where available.

    For internal links, WordPress could generate this preview from existing site data, such as the page title, featured image, post type, and permalink. For external links, the preview could use available metadata such as the page title, description, favicon, and Open Graph image.

    A visual snapshot would make it easier for users to confirm that they are linking to the correct destination before publishing. This would be especially useful on larger websites where multiple pages may have similar names or URLs.

    To avoid performance and privacy concerns, the visual snapshot could be optional, cached, or only loaded when the user expands the link preview.)

    Also, this

    The current Links control documentation explains how to add and edit links, but a few areas could be made clearer for users who are new to the block editor.

    The documentation could be improved by adding short explanations for the following:

    1. What the Links control does

    The introduction should clearly explain that the Links control allows users to add, edit, search for, and configure links inside supported blocks. This helps users understand the purpose of the feature before following the steps.

    1. The difference between hyperlinks and embeds

    The documentation should explain that adding a link to selected text is different from pasting a URL on its own line. When a URL is pasted on its own line, WordPress may create an Embed block with a preview. However, when text is highlighted and linked, WordPress creates a normal hyperlink.

    1. Accepted link formats

    The valid URL section could include more examples of supported link types, such as:

    https://wordpress.org

    /about

    #contact

    mailto:name@example.com

    tel:+123456789

    This would help users understand that links are not limited to normal website URLs.

    1. What the URL validation actually checks

    The documentation should explain that WordPress checks whether the URL format looks valid, but it does not confirm that the destination page exists or loads successfully.

    1. What “Open in new tab” means

    The documentation should explain that turning on this option opens the link in a new browser tab, while leaving it off opens the link in the same tab.

    1. What “nofollow” means

    The documentation should briefly explain that the nofollow option tells search engines not to pass ranking value through the link. This is useful for paid, sponsored, user-submitted, or untrusted links.

    1. Internal and external links

    The documentation could explain the difference between linking to content on the same website and linking to an outside website. This would help users understand when to use site search and when to enter a full external URL.

    1. Link settings across different blocks

    The documentation could mention that link settings may appear slightly differently depending on the block being used, such as Paragraph, Button, Image, or Navigation blocks.

    Hi @AbayomiOye! Thank you for your review! I've made these updates. I will close this issue, but please share your WordPress.org profile username in the comments so I can add props to you in the Changelog. I was not able to find your profile :(

  14. AbayomiOye commented on Jun 13, 2026

    @AbayomiOye
  15. kedarjoyner commented on Jun 14, 2026

    @kedarjoyner
    Collaborator

    Thanks @kedarjoyner It's https://profiles.wordpress.org/blessingoye/

    @AbayomiOye Great! I've added the props! Thanks again 🫶

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Type

No type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions