Days
Hours
Minutes
Seconds
x

New Froala Editor v5.0.0 is here – Learn More

Skip to content
Froala Documentation

Link to Anchor Plugin

Plugins are fully functional during your trial once you've added your trial key to the setup.

Adds the option to create internal anchor links for navigating long documents. This enhancement introduces the ability to insert named anchors and link to them, enabling smooth scrolling to specific sections when a user clicks an anchor link.

Note: After inserting named anchors, the Link plugin’s insert popup will include a dropdown list of available anchors. This allows users to easily connect a link to a specific anchor. When editing a link, clicking the first button in the edit link popup will smoothly scroll to the target section.


Plugin options:

anchorEditButtons
Array
The list of buttons that appear in the edit anchor popup, when clicking on an existing link from the editor.
Default:
[ 'anchorEdit', 'anchorRemove' ]

Plugin events:

anchor.beforeInsert(link, text) Triggered before inserting an anchor inside the editor
● link
The HTML content of Anchor
● text
The text to be used for the anchor.
anchor.beforeRemove (link) Triggered before removing an anchor inside the editor
● link
The HTML content of Anchor at the time of removal.

Add Plugin to your code:

Plugin name: linkToAnchor

Plugin JS Script: ../js/plugins/link_to_anchor.min.js

Or from CDN https://cdn.jsdelivr.net/npm/froala-editor@latest/js/plugins/link_to_anchor.min.js

Plugin CSS link: ../css/plugins/link_to_anchor.min.css

Or from CDN https://cdn.jsdelivr.net/npm/froala-editor@latest/css/plugins/link_to_anchor.min.css

Sign up

Download the code by signing up for our newsletter

Sign up

Download the code by signing up for our newsletter

Note: By registering, you confirm that you agree to the processing of your personal data by Froala, Inc. - Froala as described in the Privacy Statement. Froala, Inc. - Froala is part of the Idera group and may share your information with its parent company Idera, Inc., and its affiliates. For further details on how your data is used, stored, and shared, please review our Privacy Statement.