Links to Webpages and Files - Drupal 9

To create a link:

  1. Type the text/insert the image for the link.
  2. Select the text/click on the image.
  3. Click the Link button. 
  1. The Edit Link dialog will appear.
  2. Do one of the following:
    1. Link to another site: Type or paste the complete link URL in the URL box.
    2. Link to a page on this site:
      1. Begin typing the page's title or a keyword from the title in the URL field. Autocomplete will suggest matching pages.
      2. Select the appropriate page from the list.
      3. Click the Save button. The Edit Link dialog will close.
    3. Link to a document/file in the Media Library:
      1. If the file is already uploaded to the website, begin typing the filename in the URL field. Autocomplete will suggest matching files.
        1. Select the appropriate file from the list.
        2. Click the Save button. The Edit Link dialog will close.
      2. If the document/file hasn't already been uploaded, or if you can't remember the filename and want to look for it, click the Media Library button. The Add or select media dialog will open.
        1. To upload a new file, make sure the Document tab is selected. Click the Browse button under Add file. Select the file on your computer and click Open. 
           
  1. Provide a clear, concise description of your document that will help you to find and identify it in the future. 
     
  1. Click Save.
  2. Find and click the appropriate file in the Media Library to select it. (The checkbox should be checked.) 
     
  1. Click the Insert selected button. Add or select media dialog will close.
  2. Link to a page generated by the "Views" module (such as the calendar):
    1. Enter a relative URL (the segment of the URL that follows the “.org”), including the slash.
    2. Example: for a link to http://www.example.org/calendar/month, enter only /calendar/month
  3. Click the Save button.
  4. Test the new link to confirm it goes to the expected location.

Advanced Options

Click "Advanced" in the Add Link dialog to set the following options:

  • ARIA label (uncommon): Provide an alternative text value/label for assistive technologies. Example: When using link text such as "Read more," which may be repeated by other links on the page, ARIA label text can replace the link text with a more descriptive, accessible label (e.g. "Read more about XYZ specific topic"). The words 'Read more' are repeated in the aria-label (which replaces the original anchor text of "[Read more...]")
  • CSS classes: List of CSS classes to add to the link, separated by spaces.
  • ID: Allows linking to this content using a URL fragment. Must be unique.
  • Open in new window/tab (not recommended for most situations): "noopener" will also be added to the Relation field to prevent a security vulnerability being exploited by the linked site.
  • Relation: It's recommended to add "noopener" when setting a link to open in a new tab/window to prevent a security vulnerability being exploited by the linked site.