Links
Links guide a user to another page on your site, an external site, or a document.
Links are almost always identified by text that uses GW’s light blue color and is underlined or labeled as a link for screen readers. Images can also be made into links.
How to Use Links
- Highlight a word or string of text then use the link button (
) in the top row of the WYSIWYG text editor.
- If linking an image, click on the image to select it, then use the same link button in the WYSIWG toolbar.
- In the URL field, search for existing pages or files on your site by name, or paste the URL of an external site.
Note: If you are linking to a file or another site expand the Advanced dropdown and check the box labeled "Open in new window/tab".
Link Best Practices
Create in-line, contextual links. They should be worked into a sentence rather than listing a full URL.
Good Example: Learn about GW Drupal user accounts on the Managing Access page.
Bad Example: Learn about GW Drupal user accounts by going to: https://drupal2022demo.gwu.edu/managing-access
- Make sure any links to external URLs or files open in a new window.
- Avoid using generic language for your links such as "Click Here" or "Read More".
- Don't add extra styles to links (ex: bold, underline, or italics).
Other Types of Links
Button links are a great way to call attention to a link by adding some styles.
- Use the Button button (
) in the WYSIWYG toolbar to add a button to your page - Select a color, size, and width
- Add your button text and link URL
Example: Apply Now
Note: The GW button links are execptions to the best practice of not adding additional styles to a link. They have been developed with accessibility in mind.
Anchors and Anchor Links are helpful tools that allow visitors to jump to a section of a page with one click. These can be especially useful if a page has a lot of content and you want users to be able to get to specific sections quickly. One of the most common uses for Anchor links on the web is the “Back to top” link at the bottom of a page.
Adding an Anchor
- First, place your cursor where you want visitors to be brought and use the Anchor button (
) in the WYSIWYG toolbar to insert one. - Give the anchor a name and after clicking OK, you will see a red flag icon next to your cursor, marking your new anchor.
Creating a link to an Anchor
- Highlight the text you want to use as a link and use the link button in the WYSIWYG toolbar.
- Put the URL for the page you are linking to followed by # and the name you gave the anchor.
Example: Go to the top of this page - https://drupal2022demo.gwu.edu/links/#top - Once you save the page, the link you created will bring you to the spot on the page where you added the anchor.
Tip: Test your anchor. If the link does not go to the exact spot you want, try moving it up on the page.
Using Anchors to create a Table of Contents
You can use Anchors and a list of Anchor Links to create a table of contents on a long page with a lot of text.
The Utility Links block is a feature that allows site owners to display up to eight custom text links above the Main Header.
The links display in a horizontal row in a buff bar.
- A maximum of three links can display on the left above the site's logo
- A maximum of five links can display on the right above the search box and optional call-to-action button link
To learn how, check out the instructions on the Images & Media page.