Drupal Lite 7: Link to Different Locations on the Same Page (Anchor Links)

Anchor Links are hyperlinks that link to other locations on the same page. They are often used to create a table of contents at the top of a very long page.

Note: some of the older Drupal Lite sites are missing the proper permissions for creating Anchor Links. If you've followed the instructions for creating Anchor Links, and they're not working, please contact 1-HELP.

Instructions

Create the Anchor

  1. Place your cursor in the location that will serve as the destination
  2. Click the Anchor the anchor buttonbutton on the editing toolbar 
  3. In the Anchor Properties/Anchor Name dialog box, enter a name for the Anchor
    1. The name cannot contain spaces
  4. Click OK
  5. A small picture of a flag will appear in the location of the anchor. The picture is only visible when you are editing the page. Visitors will not see the flag picture.

Create the Anchor Link

 

  1. Select the text that will serve as the link
  2. Click the Link the link button on the editing toolbar button on the editing toolbar
  3. In the Link Type dropdown, select Link to Anchor in the Text
  4. Select the anchor name from the dropdown selector
  5. Click OK

 

anchors in the editing window 

Note:

This method will only work for creating anchors and anchor links in the same content pane. You won't be able to create an anchor link that targets an anchor in a different content pane. If the anchor is in a different content pane, when you select the Link to Anchor in the Text option it will display no anchor exists.

To resolve this limitation, manually add the anchor link using the HTML editor.

  1. Switch the editing window from the WYSIWYG editor to the HTML editor
  2. Locate the text you'd like to use as the link
  3. Add the HTML code for anchor links
    1. <a href="#YourAnchor">your link text</a>
    2. Replace "#YourAnchor" with the real name of your anchor that you previously created