Components
Link Element

Link Element

Hyperlink element.

Installation

Install the following dependencies:

npm install @udecode/plate-link @udecode/plate-selection

Copy and paste the following code into your project.

Get the code ->

Update the import paths to match your project setup.

Examples

Link

🔗 Link

Add hyperlinks to your text to reference external sources or provide additional information.
How to use links:
  • Press "⌘ + K" to trigger the floating link menu.
  • Enter the URL (must be a valid http:// or https:// address) and the text to display.
  • Use "Tab" to switch between URL and display text fields.
  • Press Enter to insert the link.
  • Select text before pressing "⌘ + K" to pre-fill the display text.
  • Use the floating toolbar's link button when text is selected.
  • Click on an existing link to edit, visit, or remove it.