Live Edit


 






Add Anchors

Who can use this feature?

System_Admin.png Slash.png Owner.png Slash.png Publisher.png Slash.png Author.png

 

 

Overview

Users may add HTML anchors to a page to help assist readers with navigation. Anchors are shortcut links that lead from one section of a page to another section on the same page.

Instructions

  1. Navigate to the page you wish to add anchors to
  2. Ensure that Live Edit Is On
    locked_page_live_edit_on.jpg
  3. Select the Widgets tab on the left-hand side
    image_widget_widgets_tab.jpg
  4. Drag-and-drop the Editor widget to your page
    Widget_Add.png
  5. Create your content in the normal Editor screen
    add_anchors_create_content_in_editor.jpg
  6. Click the HTML/Code View option on the toolbar
    add_anchors_switch_to_code_view.jpg
  7. Scroll to the section you want to navigate to and add the HTML attribute id="hello" next to the words you want to link to within a page. 
    add_anchors_edit_code.jpg
    • Note: Replace the second name with a more specific code. Leave the quotation marks as part of the code.
  8. Scroll to the part you want users to click on to get to a different section and add the HTML code <a href="#name">[text]</a> next to the words you want to link to
    add_anchors_edit_href.jpg
    • Note: Again, replace name with a more specific code, and leave the quotation marks and pound sign/hashtag.
    • Note: Ensure that after the text you close the HTML link with a </a>.
  9. Re-click on the Code View button to return to the regular view
    add_anchors_exit_code_view.jpg
  10. Ensure that one of the sections is a link and the other appears as just plain text
    add_anchors_link_and_plain_text.jpg
  11. Click the Green Checkmark to exit the Editor
    add_anchors_green_checkmark.jpg
  12. Navigate to the top of the screen and select Save
    list_widget_save_page.jpg
  13. View your page in Preview Mode
    add_anchors_preview_current_page.jpg
  14. Click on the Anchor link and ensure that it directs to your desired section 
    add_anchors_check_anchor_link.jpg



I'd Like to Request an Enhancement

2 out of 2 found this helpful

Updated:
Follow

Article Feedback