Note: This plugin is only available for paid TinyMCE subscriptions.
The linkchecker
plugin does what it says – validates URLs, as you type them. URLs considered invalid will be highlighted with red and will have a dedicated context menu with options to either edit the link, try and open it in a separate tab, remove the link, or ignore it.
The Link Checker plugin relies on HTTP response status codes to determine if a link is valid. Web pages that return incorrect or invalid HTTP responses are highlighted as invalid or “broken”. For information on valid HTTP response status codes, see: MDN Web Docs - HTTP response status codes.
Cloud Instructions
If you are using Tiny Cloud, simply add "linkchecker"
to your plugins list, and the service will be automatically configured.
Basic setup using Tiny Cloud
tinymce.init({
selector: 'textarea', // change this value according to your HTML
plugins: 'linkchecker'
});
Self-hosted Instructions
Customers using a Self-hosted environment will need to provide a URL to their deployment of the link checking service via the linkchecker_service_url
parameter
Basic self-hosted setup
tinymce.init({
selector: 'textarea', // change this value according to your HTML
plugins: 'linkchecker',
linkchecker_service_url: 'http://mydomain.com/linkchecker'
});
Options
Link Checker has the following settings.
linkchecker_content_css
After a link is checked for validity, a result of the validation is added to it via data-mce-linkchecker-status
attribute. There are three possible outcomes of the validation: valid
, invalid
and unknown
. Link Checker visually reflects invalid
outcome by injecting the following CSS styles into the editor:
a[data-mce-linkchecker-status="invalid"] {
outline-color: rgba(231, 76, 60, 0.25);
background-color: rgba(231, 76, 60, 0.25)
}
a[data-mce-linkchecker-focus="true"] {
outline: 1px solid rgba(231, 76, 60, 0.75)
}
data-mce-linkchecker-focus
attribute is set to true every time a dedicated context menu is shown on a link. This only happens for invalid
links.
It is possible to replace or extend those styles, by providing a URL to custom stylesheet via linkchecker_content_css
option.
linkchecker_preprocess
The linkchecker_preprocess
function is used for adjusting links before performing a link check.
Type: Function
Example: Using linkchecker_preprocess
tinymce.init({
selector: 'textarea', // change this value according to your HTML
plugins: 'linkchecker',
linkchecker_preprocess: function (data) {
/* This example will encode or double encode the url */
var newUrl = encodeURIComponent(data.url);
return { url: newUrl };
}
});
linkchecker_service_url
A URL of the server-side link validation service. This is required option, without it plugin will fail to operate and will throw a corresponding warning on the screen.
Type: String
Example: Using linkchecker_service_url
tinymce.init({
selector: 'textarea',
plugins: 'linkchecker',
linkchecker_service_url: 'http://mydomain.com/linkchecker'
});
Was this article helpful? Yes - No
Well, that's awkward . Would you mind opening an issue or helping us out?
Thanks for the feedback!
Can't find what you're looking for? Let us know.
Except as otherwise noted, the content of this page is licensed under the Creative Commons BY-NC-SA 3.0 License, and code samples are licensed under the Apache 2.0 License.