Ngā Hononga Katoa
All of the links
An example of all of the components that can have links, and how to define them for internal/external pages/sites and email/phone links.
Link types
There are basically 4 types of link you can use:
- External links
- Internal links (relative to the base URL), start with `/`
- These are always appended to the base URL (https://{environment}.watercare.co.nz)
- Email links
- Phone links
Rich Text Editors
RTE can use all of the links other than Internal links (relative to the current URL)
External links
External link (Google)
- An external link should start with https://
Internal links
Internal link (Faults and Outages)
Email links
Email link (Email Simon)
- You can pre-fill other fields if you'd like to:
- cc: Carbon copy email address(es). Separate multiple addresses with commas.
- bcc: Blind carbon copy email address(es). Separate multiple addresses with commas.
- subject: The subject of the email.
- body: The body text of the email.
- Must be encoded as URL (e.g. %20 replaces space). ChatGPT or other online tools can encode for you.
Email link (Pre-fill everything)
mailto:[email protected]
&subject=Hey%20from%20the%20link%20page
&body=Hey%20this%20is%20a%20message%20for%20Simon%20and%20Kevin%20from%20the%20link%20how%20to%20page
Pre-filled body With line breaks!!!
Phone links
Phone link (Get the time)
- Do not put spaces in between numbers
Additional key presses
To create a tel: link that includes options like "Press 1" and "Press 2" after dialing a number, you can utilise commas (,) to represent a brief pause (usually 2 seconds) which can be used to wait for the call to be connected, then add the button press.
Example: call, pause [~2 seconds], press option 2
You can add more commas for longer pauses, if necessary:
Quick Actions
Quick actions can use all five types of links.
Quick Actions large
Quick actions large can use all five types of links.
Cards
Cards can use all five types of links.
External link
This will go to an external site [https://www.google.com]
Internal link (from base url)
This will be placed after the Base URL [/faults-and-outages]
This will start an email [mailto:[email protected]]
Phone
This will start a call [tel:0800000000]