Linking (Drupal 9)

Absolute vs Relative Links

If you want your content to link to a different department website or other external website, you would use what’s called an absolute link. This would simply be the entire URL address of the page you wish to link to. For example if you wanted the image/text to link to the main StFX website, the link you would enter would be https://www.stfx.ca/. This also applies to PDF files or word documents that are located on other websites.

If you want your content to link to a page within your department website, we ask that you use a relative link. What this means is that instead of writing out the entire link, ex. https://www.mystfx.ca/department/second-page , you would only write /department/second-page. Again, this also applies to PDF or Word documents that are located within your site. The absolute link for a PDF would look something like this: https://www.mystfx.ca/sites/department/files/2020-05/file%name, to convert that to a relative link you would simple erase anything that comes before /sites, so this link would be /sites/department/files/2020-05/file%name. Using relative links will assist in future migration projects.

Adding a link to Text

Highlight the text you which to add a hyperlink to and then click the link button from the toolbar in the WYSYWIG editor.

This will then open a prompt to write in your link.

Linking an Email

If you want your link to open the mail app to send an email, highlight the text which you which to link as an email then click the link button on the toolbar as you would when linking any text.

From the Add Link prompt, you would simply type the desired email address and WYSYWIG will identify it as email type, so it will show a message

You will click the suggestion that appears under the email or hit the Enter key

The text will now show like this:

Doing this will allow users to click the link and open their default mail app with the recipient already filled:

Including a Subject Line

You can also add a pre-filled subject line and message body. This can be particularly useful if the recipient would want to be able to filter their emails by which ones have come from your webpage. To do this, you have to be positioned on the email, with the step done before (Linking an Email).
 

The just press CTRL+L and the following window will pop up

 

There are new fields now. You can now fill a default Message Subject and Message Body.

Now if a user clicks on this link, it will open their default mail app with the recipient, subject and body fields filled.

Adding a link to an Image

If you want people to be able to click your image and have that take them to another page, first add the image as explained above. Then, while still in the editor, click on the image to select it and then click the link button in the toolbar:

You will see a pop-up window asking for a URL:

Menu Linking

For information on adding menu links, see the Editing your Department Menu article