Links

The Insert/edit Link button is used to add or update links to internal pages, external pages, media files, email links, and anchors. To insert different types of hyperlinks, follow these steps:

Link to a Page on Another Website

1. Select the text for the hyperlink.
2. Click the Insert Link button. The Select Link tree opens on the right-side of the editor.
3. In the Link field, enter the URL of the web page you wish to link to.
4. In the Link title field, enter the text that will be shown as a pointer to the link. This is an important information for everyone reading the website with different accessibility aids.
5. In the Target field, select the checkbox if you want the link to open in a new window or tab.
6. Click Submit.

Link to a Page in Umbraco

1. Select the text for the hyperlink.
2. Click the Insert Link button. The Select Link tree opens on the right-side of the editor.
3. Select a page from the Link to page tree. The selection will populate the Link and Link Title fields.
4. In the Link Title field, enter the text that will be shown as a pointer to the link. By default, the name of the selected page will be populated.
5. In the Target field, select the checkbox if you want the link to open in a new window or tab.
6. Click Submit.

Link to a Media File in Umbraco

1. Select the text for the hyperlink.
2. Click the Insert Link button. The Select Link tree opens on the right-side of the editor.
3. Select the Select media button. The Select media tree opens where you can select the media item.
4. Click Select. The selection will populate the Link and Link Title fields.
5. In the Target field, select the checkbox if you want the link to open in a new window or tab.
6. Click Submit.

Link to an email address in Umbraco

1. Select the text for the hyperlink.
2. Click the Insert Link button. The Select Link tree opens on the right-side of the editor.
3. In the Link field, enter the text mailto: followed by the email address you wish to link (e.g. mailto:name@company.com)
4. In the Link Title field, enter the text that will be shown as a pointer to the link.
5. In the Target field, select the checkbox if you want the link to open in a new window or tab.
6. Click Submit.

Link to an Anchor on the Same Page

An anchor allows you to create internal page links that enable users to navigate within a page. There are two parts to setting up an anchor - the anchor itself and the link to the anchor.

Creating an anchor

1. Select the text or place the cursor where you wish to create the anchor.

2. Click the Anchor button. The Create Anchor dialog opens.

   

3. Enter the anchor name in the ID field. Aoid special characters and do not use spaces.

   

4. Click OK. You will see a small anchor icon where you previously had the cursor in the editor.

To delete the anchor:

1. Select the anchor icon in the editor.
2. Press the Delete key.

Linking to an anchor

1. Select the text where you wish to add the anchor.
2. Click the Insert link button. The Select Link tree opens on the right-side of the editor.
3. Add a #symbol followed by the name of your anchor in the anchor/querystring field.
4. Click Submit.

Create a Link from an Image

You can make images into clickable links in Umbraco:

1. Insert an image into the editor (see Working with Images, for more details).
2. Select the image to form the hyperlink.
3. Click the Insert Link button. The Select Link tree opens on the right-side of the editor.
4. In the Link field, enter the URL of the web page you wish to link to.
5. In the Link title field, enter the text that will be shown as a pointer to the link.
6. In the Target field, select the checkbox if you want the link to open in a new window or tab.
7. Click Submit.

Removing a link

To remove a link:

1. Select the link in the editor. For text links, place the cursor anywhere within the link text. For an image, select the image itself.

2. Click the Remove Link button which removes the hyperlink.

   

If the remove link button is not in your richtext editor toolbar, you can add the Remove Link button:

1. Navigate to your rich text editor.

2. Go to the Editor Settings window.

3. Select Remove Link.

   

Alternatively, click the Insert/Edit Link button and manually remove the link from the Link field.