Create a Link – College of Fine Arts Drupal Instruction

Clicking links is the main interaction visitors have with websites. Be sure to follow linking best practices and make sure your links have good context and appearance.

Use the Link Button to create hyperlinks. A link can go to:

another page within the site
an external website
an email address
telephone numbers can initiate a phone call on a smart phone
a pre-filtered aggregated list, like to a specific event type
an “anchor” (flagged area in the same page)
a PDF uploaded to the site
Content Administrators can add and update menu items.

Basic Steps

In the below image, imagine you want the words “runcible spoon” to be a link. First, select the words which will become the link. Remember, all links must have context. Second, click the Link Button.

Text field with the words "runcible spoon" selected and the Link Button highlighted.

This will bring up the Link Button Dialogue Box.

Link button dialogue box with Link Type Dropdown expsed, showing Internal path, URL, Link to anchor in the text, and E-mail options.

Pick the Link Type you need from the drop-down menu.

Available Link Types

Internal Path or PDF

When you choose the Internal path or PDF link type a text field will appear where you should start typing the title of the page or PDF you wish to link to. Drupal will search the page titles and PDFs in the Media Library for ones that match and display a drop-down of possible matches. Select the correct page and Drupal will build the link for you.

Link dialogue box with Internal path selected as link type. Below, the link field contains the word Career and it's autocomplete dropdown shows titles that contain the word Career.

(Before linking to a PDF please make sure it is optimized for the Web and you have followed all of the accessibility requirements.)

URL

If you need to link to a page outside of the current website, choose the URL link type. You will then be presented with a drop-down titled Protocol and text field titled URL. The protocol refers to the beginning of a URL, typically http://.

Example

If you want to link to Google, the URL is http://www.google.com. From the Protocol field select http://. Type www.google.com, in the URL field.

Link dialugue with URL set as Link Type, Protocol dropdown set to http://, and URL field containing www.google.com.

E-mail

When you choose E-mail as the link type, you will see three text fields: E-mail Address, Message Subject and Message Body. The only required field is email address. When a visitor clicks on the link, a new email window will pop-up on their computer ready to send to this address. If you fill in the Message Subject and Message Body fields, the window that pops-up will also have those fields filled in.

Link dialogue with Link Type set to E-Mail. The Email Address field contins bob@bob.com, the Message Subject and Body fields are empty.

Link to anchor in the text

The Link to anchor option allows you to link to to specific spots within a page and can be useful on long pages with multiple sections. Full instructions for doing this can be found in Linking to Another Spot on the Page.

Link to External

Some content types have a field that allow you to link the Title to an external website when the item is listed on an aggregated view. This can be a bit confusing because the behavior is different than all other titles. Learn more about these external link fields.

Telephone Number

You can edit the source code or fill in the link info box as shown in the screenshot below:

link dialog showing to select the "other" protocol and enter the phone number with in the format tel:15555555 — Link dialog showing to select the protocol and enter the phone number with in the format: “tel:15555555555”

Learn more

Links are essential to website navigation. It may seem simple but the better foundational understanding you have of all the options the more dynamic your websites will be. We have more information about linking on our General Instruction site.