Create an Anchor Link

Creating an anchor link is a quick way to navigate to specific content within a webpage.

When to use it
  • To jump to a section on a long page
  • As a link that goes directly to part of a page
  • Organize and condense like content by sections, themes or alphabetically on one page
Where to use it
  • When you need on-page navigation
  • Long content, such as handbooks and conferences
  • To provide a quick topic list/overview for the user

How to Create and Add an Anchor Link

  1. Log into Drupal
  2. Go to page you wish to edit.
  3. Pick a Paragraph Component where you want to add an anchor link. You can only add anchor links to certain Paragraph Components:
  • Text
  • Teaser
  • Cards
  • Cards (No Image)
  • Image Promo
  • Gallery
  • Single Item Slider
  • Custom Slider
  • Upcoming Events
  • Horizontal Card
  • Link List
  • Accordions
  • Callout Box
  • However you can add hyperlink to any page by adding a text box above the section you wish to link to.
  1. Choose a word or sentence you want to turn into an anchor link and click the Anchor Link flag icon in the toolbar next to that word.
  2. In the pop-up, enter your anchor name in this format, for example: anchor-name
    1. Click the green check mark to save your anchor link.
  3. Save paragraph before exiting.
  4. Link to the anchor on that page or if done, save page as "Ready to Review".

Linking to the Anchor

On the Same Page

  • You can add an anchor link in any Paragraph Component where hyperlinks are allowed.
    1. Select the text you wish to link.  Add a link (link icon in the toolbar)
    2. Use the anchor name you created and with a # before it
      1. Example: #anchor-name
    3. Save Paragraph Component.
    4. Save page as "Ready to Review".

On a Different Page or Separate URL

  • The anchor link is a separate URL that can be used on another page or alone.
  1. Use the URL of the page where the anchor is located followed by the anchor name,
    1. Example: /department-page/page-name#anchor-name. (Copy the relative URL without the domain and add the anchor name.)
      1. Anchor Link Example: /school-health-human-sciences/nutrition-dietetics-ms-degree-details#MissionGoals
  2. Save the paragraph.
  3. Save page as "Ready to Review".
Real Life Examples

Additional Web Editing Resources

Photo of University Marketing and Communications
University Marketing and Communications
Physical Address
1007 Campanile Ave.
Brookings, SD 57007
Mailing Address
Communications Center 105, Box 2230
Brookings, SD 57007
Hours
Mon - Fri: 8:00 a.m.-5:00 p.m.
Follow Us