#  Linking to on-page anchor links 

 



 ##  

  expand\_more  

 
  

 

## How to link to a component or other content within a page

To link directly to a specific component or content within a page, you need to create a unique ID for the component that you can reference in links. We recommend using only lowercase letters, numerals, and hyphens (-), for example, “department-donors”.

### Step 1: Create anchor link

#### Create an anchor link within text

1. Click on the **\#ID** icon in the text editor
2. Enter the anchor id in the **Element ID** field.

 ![screenshot of the text editor toolbar and the #ID field selected](/sites/g/files/omnuum1651/files/2025-08/anchor%20id%20wysiwyg.png)

 

To add an anchor link to text within the page, enter a descriptive ID in the **Element ID** field of the text editor toolbar.#### Create an anchor link on a component

1. Locate the **Page Anchor Link** input field under the **Block Settings** or **Settings** tab for components and component content.
2. Enter the anchor id in the **Page Anchor Link** field.

   ![Screenshot of Block Settings tab panel showing display setting options with the Page Anchor Link input outlined](/sites/g/files/omnuum1651/files/styles/hwp_1_1__720x720_scale/public/2024-07/Page%20anchor%20link.png?itok=Jgp_9DCX) 

 

To add an anchor link to a component or component content, enter a descriptive ID in the **Page Anchor Link** input field. This example screenshot is from an **Accordion** component.### Step 2: Link to an anchor link

The method for linking to an anchor depends on the source of the link. This example describes how to create a text link using the editor toolbar.

1. Select the text to link from the text input area.
2. Select the **Link** button in the editor toolbar (see [Text Editor](https://prod-designsystem.drupalsites.harvard.edu/resource/text-editor) for details about using the toolbar and text input area).
3. Enter the first few letters of the name of the content, for example, “History” to link to the History of the Department page or “Grace C” to link to the Grace Chan person page. Select the desired content from the autocomplete **Content** menu (see [Internal Links](/resource/internal-links "Internal Links") for guidance on linking content within a site).
4. Add “#” followed by the page anchor link ID created in the content, for example, “history#department-donors” to link to <https://drupaldemo.harvardsites.harvard.edu/history#department-donors>.

   ![Screenshot of the Body editing toolbar and text input area highlighting (1) the selected text, (2) the Link button in the editor toolbar, and (3) the Link URL input containing a relative URL and page ID](/sites/g/files/omnuum1651/files/styles/hwp_1_1__720x720_scale/public/2024-07/Link%20to%20anchor.png?itok=p3Qg0pJo) 

 

Select the text to link **(1)** and then the **Link** button in the editor toolbar **(2)** and enter the page name in the **Link URL** input. Select the page from the dropdown menu and add a “#” character followed by the anchor ID to the relative URL displayed the **Link URL** input **(3**). Select the checkmark to apply the link to the selected text.

 

---

 

##  Related resources 

 



  [### Checking for (and managing) broken links on your HarvardSites site

 ](/resource/checking-and-managing-broken-links-your-harvardsites-site)Identify, fix, and prevent broken links on your site.



 

 

   ![AI-generated image showing nodes connected by lines](/sites/g/files/omnuum1651/files/styles/hwp_16_9__480x270/public/2025-10/pexels-googledeepmind-17485658.jpg?itok=uU0i8Pjm) 

 



 

 

   [### Content URLs

 ](/resource/content-urls)How content URLs are generated and managed on the platform.



 

 

   ![A modern building with a grid-like facade of metallic panels and glass windows. ](/sites/g/files/omnuum1651/files/styles/hwp_16_9__480x270/public/2025-02/thumb_content_URLs.jpg?itok=cHWhzIer) 

 



 

 

   [### Internal Links

 ](/resource/internal-links)How to link different types of content and content types within your site



 

 

   ![Closeup of a structure of tubes connected to wooden blocks, overlaying a window and buildings beyond.](/sites/g/files/omnuum1651/files/styles/hwp_16_9__480x270/public/2024-11/thumb_internal_links.jpg?itok=-aQTLRjI) 

 



 

 

  

 

 

 

 

 



 

 See also:- [ How-tos ](/content-structure/how-tos)
- [ Links ](/general-site-management/links)