Instructions for Common Content Tasks: Configuring Hyperlinks

A Drupal CMS Guide for Marketers

Hyperlink Language

There are many circumstances under which you’ll need to add hyperlinks to your content, and a variety of link types that you might want to add to your website:

  • Internal webpage links – Links to other pages within your own website. You have the option to make internal webpage links load in a Colorbox—a small window that will pop-up over the main page—instead of loading in the full browser window.

Note: Internal webpage links should be relative links, which means you will link to the location of the page relative to the rest of your website. That way, if the root address of your website ever changes, all of the internal hyperlinks will still function.

  • External webpage links – Links to other pages on your website or to external websites. External webpage links are absolute links—in other words, you will supply the full URL for the page you are linking to.
  • Anchor links – Links to bookmarks within your website content.
  • Email links – Links that will open up a new email message to a specific email address.

Note: Use email links sparingly, especially on public pages—they can be spam magnets.

  • File links – Links to files you’ve uploaded, such as PDFs, word documents, or presentations.

To Add a Link to the Body of a Page:

  1. In the Body field, select the text you’d like to add the hyperlink to.

Note: You can also add a link to an image by selecting an image instead of text and following the instructions below.

  1. Click the Add Link button on the formatting toolbar: Add link
  2. The Link window will open:

Link window

To Create a Link to Another Page on the Website:

  1. Leave Link Type as ‘URL’, but from the Protocol dropdown, select ‘’. This will create a relative link to the page.
  2. In the URL field, type the alias for the page to which you want to link. The alias is the part of a URL that comes after your main website’s address. For example, if your website’s contact page is [Your URL > Custom > Client URL]/contact, you would type ‘/contact’ into the URL field.
  3. From here, you have the option of configuring the link to open in a Colorbox instead of in the main browser window.

To Make Your Internal Link Open in a Colorbox:

  1. Still in the URL field, add the following immediately after the alias: ?width=[number of pixels]&height=[number of pixels]. You can supply whatever dimensions you like for the width and height of the colorbox—850x720 is a nice reasonable size, for example.
  2. So, now your URL field should read: /[page alias]?width=[number of pixels]&height=[number of pixels]
  3. Finally, click on the Advanced tab.
  4. In the Stylesheet Classes text box, type the following: colorbox-node

Lucky Peach

Colorboxes can be very useful for displaying help text or definitions or Webforms without taking visitors away from the page they’re on.

To Create a Link to an External Website:

  1. Leave Link Type as ‘URL’.
  2. In the URL field, type the address you want to link to. Do not include the ‘http://’. It will be added automatically.
  3. Often, if you’re linking to an external website, you’ll want to set that link to open in a new window so your visitors aren’t taken away from your website.
  4. To set a link to open in a new window, click the Target tab on the top of the Link window.
  5. From the Target dropdown, select ‘New Window (_blank)’.

To Create an Anchor Link:

  1. From the Link Type dropdown, select ‘Link to Anchor in the text’.
  2. From the By Anchor Name dropdown, select the anchor you want to link to.You must have anchors defined in your content in order to link to them.

To Create an Email Link:

  1. From the Link Type dropdown, select ‘E-mail’.
  2. Type the email address you want to link to in the Email Address field.
  3. It’s optional, but if you like, you can also add a default Message Subject and Message Body, which will be automatically added to the email message that is created when someone clicks this link.

Note: Remember, use email links sparingly, since they can attract spam to your inbox. For public pages, contact forms are usually a better option.

To Create a Link to a File (for example, a .pdf, .doc, .xls, etc.):

  1. Leave Link Type as ‘URL’, but click on the Browse Server button to open up the File Browser window. If you do not see the Browse Server button, your user account may need additional permissions. Please contact your website administrator or The Bear Group.
  2. You can either select an existing file to link to or you can upload a new one to the server.
  3. Once you’ve selected the file, click the Insert File button to get back to the Link window.
  4. From here, you have the option of configuring the link to open in a Colorbox instead of in the main browser window.

Note: For help using the File Browser, refer to the instructions in the Configuring In-Line Images blog post.

To Make Your File Link Open in a Colorbox:

  1. Go to the Advanced tab in the Link window.
  2. In the Stylesheet Classes text box, type the following: colorbox-load
  3. When you’re done configuring your link, click the OK button to save your changes.

For more how-to guides on Drupal tasks, check out the other posts in our blog series, Instructions for Common Content Tasks