A fictional supplier bulletin contains a reference link inside an emphasized sentence. The author needs to edit that link when right-clicking its text, while retaining browser tools for ordinary text. Adding every image and table action makes that small task harder to identify.
Start with the link section
For an application with TinyMCE already loaded:
tinymce.init({
selector: '#supplier-bulletin',
plugins: 'link',
toolbar: 'undo redo | bold italic | link',
contextmenu: 'link',
contextmenu_never_use_native: false
});
Merge these options with the real application's license, loading, and other required configuration. The permanent Link button remains an alternative route to the action. The context-menu string does not install the Link plugin by itself.
Right-clicking a link and selecting a phrase are different triggers. If the control appearing near a selection is wrong, inspect Quickbars configuration. Changing contextmenu will not define the Quickbars selection toolbar.
Show a custom action only for an actual link
Suppose the bulletin also needs a menu action that displays a link's stored destination for review. Register both the menu item and its contextual section in setup:
setup: (editor) => {
editor.ui.registry.addMenuItem('showLinkDestination', {
text: 'Show stored destination',
onAction: () => {
const link = editor.dom.getParent(
editor.selection.getNode(), 'a[href]'
);
if (link) {
const destination = link.getAttribute('href') || '';
editor.windowManager.alert(editor.dom.encode(destination));
}
}
});
editor.ui.registry.addContextMenu('bulletinLink', {
update: (element) => {
const link = editor.dom.getParent(element, 'a[href]');
return link ? 'showLinkDestination' : '';
}
});
}
This is an initialization-object fragment, not a standalone script. Add it to the existing setup callback and set contextmenu: 'link bulletinLink' in the same initialization. The custom section's identifier connects its update callback to placement.
The predicate looks for an ancestor anchor because the clicked node might be an emphasized word inside it. Returning an empty string omits the custom section outside a link. The action checks again against the current selection instead of retaining a DOM node from a previous menu opening. TinyMCE's DOM encoding utility encodes the destination for display so its characters are treated as text in the alert's HTML message surface.
For a link such as <a href="/supplier/packing"><strong>Packing requirements</strong></a>, the desired review value is the stored relative destination /supplier/packing. This action does not open the destination, check its availability, or determine whether its content is approved. Keep those decisions separate from the UI shortcut.
Preserve the browser route deliberately
TinyMCE normally allows Ctrl+right-click to reach the browser menu when its own menu is enabled. Enabling contextmenu_never_use_native removes that exception. The menu options reference documents the tradeoff, including access to browser spellchecking.
To disable TinyMCE's context menu entirely, use the Boolean contextmenu: false. The string 'false' is not that value. Review any remaining context toolbars separately, particularly on mobile where a long press can expose a configured editor menu or toolbar.
Check the nested link and ordinary text
In a development bulletin, right-click the emphasized link text and confirm the stored-destination action appears. Invoke it and compare the displayed value with the actual anchor attribute. Right-click ordinary text and confirm the custom action is absent. Then try the browser-menu route your application intends to retain.
Use the permanent Link control with a keyboard too. An action that works only through right-click leaves another authoring route unfinished. Save the bulletin and inspect the reader-facing link; neither the custom menu label nor its alert belongs in the document's HTML.