Working with Links

Best practices and details on how to insert links into your pages. There are four different types of links you can insert in your page: CMS Content, URLs, Email Links, and Anchor Links.

• Inserting a Link
• Video HowTo: Inserting a Link
• Editing a Link
• Removing a Link

Best Practices

• Links should always be contextual: they should be named the same as the title of the page they are pointing to. For instance, Centre for Extended Learning points to the Centre for Extended Learning page.
• If your page is internal, within the CMS, use the target _self (this will open the link in the same window)
• If your page is external, linking to a page outside the CMS, use the target _blank (this will open the link in a new window)
• Copying/Pasting links: In general, it is best to avoid copying and pasting links in the CMS. This could introduce errors, so we recommend creating new links on your page.

Inserting a Link

1. Find the text that you would like to convert to a link, or type the link title onto the page if you haven't entered it yet.
   Remember: this text should be the same as the title of the page you are pointing to.
2. Select the text to be converted to a link.
3. Click on the 'Insert/Edit Link' button.

Figure 1. Location of Insert/Edit Link button

3. A dialog box opens and it asks: '1: What type of link is this?' Choose from: 
 

• CMS Content (links within your course)
• URL (link to external webpage)
• Email link

See the instructions for each option below.

For CMS Content:

1. Click on the blue 'Browse' button 
2. Navigate to the page you want to link to
3. Enter a 'Target' of _self (to open link in same tab)
4. Click 'Save' to return to the page editor.

For URL:

1. Enter the 'URL Address' in the field
2. Enter a 'Target' of _blank (to open link in new tab)
3. Click 'Save' to return to the page editor.

For 'Email link':

1. Enter the 'Email Address'
2. Click 'Save' to return to the page editor.

Video HowTo: Inserting a Link

View this video for a visual on how to insert each of the three types of links
(Note: the video has no audio).

Editing a Link

To edit an existing link, place your cursor anywhere in the link and click on the Insert/Edit Link button. This will open the dialog box, where you can make any changes necessary.

Removing a Link

To remove a link, place your cursor anywhere in the link and click on the Unlink button. This will remove the link.

Figure 2. Location of Unlink button

Adding Icons to Links

If your link is to an external site (that opens in a new window), you must add an icon to the end of your link. For accessibility and usability reasons, this icon clearly indicates to users that the link will open in a new tab. To add the icon to a link:

1. Follow the instructions above on inserting a URL link. 
2. Make sure  '_blank' is entered in the 'Target' field.
3. In the dialog box, click on the 'CSS Class' field.
4. Type 'cel_z-icons-new-tab' and hit enter (or select it from the dropdown menu).
5. Click 'Save' to return to the page editor.

Working with Anchor Links

Anchor links are useful to point users to a specific section of your page. This can be used on the same page, or on other pages. This requires two steps:

1. Setting the anchor (your destination)
2. Inserting the link to the anchor.

Figure 3. Location of Insert/Edit Anchor button

1. Setting the Anchor (your destination)

1. Place your cursor at the beginning of text you want as the anchor link (do not select any words), and click on the anchor button in the top bar. 
2. In the dialog box, add the Name of your anchor. (Note that the anchor name cannot contain any spaces - choose to consistently use underscores, dashes, or additional capitalization, as needed.)
3. Click 'Save' to return to the editor.

2. Inserting the link to the anchor

1. Select the text you want as the link to the anchor, and click on the Insert/Edit Link button in the top bar. 
2. Link to an anchor on current page:
   1. In the dialog box, set the type of link to 'Anchor on this page'. 
   2. Enter the 'Title' (same as Anchor name)
   3. Enter the 'Target' to _self
   4. Select the Anchor from the dropdown list (your previously named Anchor will appear here)
   5. Click 'Save' to return to the editor
3. Link to an anchor on another CMS page:
   1. In the dialog box, set the type of link to 'CMS Content'
   2. Click on the blue 'Browse' button 
   3. Navigate to the page you want to link to
   4. Enter the 'Title' (same as Anchor name)
   5. Enter the 'Target' to _self 
   6. Select the 'Anchor' location from the dropdown list
   7. Click 'Save' to return to editor
4. 'Save' and Workflow>'Submit and Approve' to save your page once you have completed your changes.