Feature No Code Attached Yet
avatar AK-CCM
AK-CCM
9 Jan 2025

Is your feature request related to a problem? Please describe.

If I want to insert a non-breaking space   in the editor I have to click on the icon in the toolbar or choose the menu item in the Edit menu. This is cumbersome and interrupts the flow of writing every time.

Image

Image

Describe the solution you'd like

It would be great if non-breaking spaces could easily inserted by the shortcut [Ctrl] + [Shift] + [Space] like in Microsoft Word or LibreOffice Writer.

Additional context

https://www.tiny.cloud/docs/tinymce/latest/shortcuts/

avatar AK-CCM AK-CCM - open - 9 Jan 2025
avatar joomla-cms-bot joomla-cms-bot - change - 9 Jan 2025
Labels Added: No Code Attached Yet
avatar joomla-cms-bot joomla-cms-bot - labeled - 9 Jan 2025
avatar AK-CCM
AK-CCM - comment - 11 Jan 2025

In the tiny docu I found some infos about howto add custum shortcuts. Unfortunately, I am already failing to get the shortcut ctrl + shift + spacebar in the example to work: https://codepen.io/AK-CCM/pen/wBwmdbg.

avatar brianteeman
brianteeman - comment - 11 Jan 2025

the demo on that page for inserting a username doesnt work either. Not sure what anyone at joomla can do to help you with that. You should contact tinymce

avatar AK-CCM
AK-CCM - comment - 11 Jan 2025

I've saved these lines (ChatGPT helped me and in CodePen it works) in plugin.js and uploaded the file to /home/www/.../media/plg_editors_tinymce/js/plugins/shortcut-nonbreaking

tinymce.PluginManager.add('shortcut-nonbreaking', function(editor) {
// Add a custom keyboard shortcut
editor.addShortcut('meta+shift+9', 'Add a non-breaking space', function() {
// Insert a non-breaking space at the current cursor position
editor.execCommand('mceInsertContent', false, '<span class="mce-nbsp-wrap mce-nbsp" contenteditable="false"> </span>');
});
});

After that I've added in the tinymce plugin at External Plugin URLs:
Plugin Name: shortcut-nonbreaking
Path: /media/plg_editors_tinymce/js/plugins/shortcut-nonbreaking

After saving changes I cleared the cache, opened an article, clicked in the editor and tried to insert a nbsp with Ctrl + Shift + 9. But nothing happens.

Did I made the plugin implementation correct?

avatar brianteeman
brianteeman - comment - 11 Jan 2025

try
Path: /media/plg_editors_tinymce/js/plugins/shortcut-nonbreaking/plugin.min.js

avatar AK-CCM
AK-CCM - comment - 11 Jan 2025

thx4hint! I've forgotten the file in the path.

Here's my actual plugin.js – it works fine to insert a nbsp with ctrl + shift + 9:

tinymce.PluginManager.add('shortcut-nonbreaking', function(editor) {
// Add a custom keyboard shortcut: ctrl + shift + 9
editor.addShortcut('ctrl+shift+9', 'Insert nonbreaking space at cursor position or selection', function() {
// Insert a nonbreaking space using TinyMCE's command
tinymce.activeEditor.execCommand('mceNonBreaking');
});
});

But if I change the key combination to ctrl+shift+space nothing happens when I press ctrl + shift + spacebar.

avatar AK-CCM
AK-CCM - comment - 12 Jan 2025

These lines work fine:

tinymce.PluginManager.add('shortcut-nonbreaking', function(editor) {
    // Listen for the keydown event to capture Ctrl + Shift + Spacebar
    editor.on('keydown', function(e) {
        // Check if Ctrl, Shift, and Spacebar are pressed simultaneously
        if (e.ctrlKey && e.shiftKey && e.key === ' ') {
            e.preventDefault(); // Prevent the browser from handling the Spacebar normally
            editor.execCommand('mceNonBreaking'); // Insert a non-breaking space
        }
    });
});

Perhaps this functionality could be merged to Joomla?
I've attached the zipped plugin.js, plugin.min.js and plugin.min.js.gz.

shortcut-nonbreaking.zip

avatar alikon alikon - change - 12 Jan 2025
Labels Added: Feature
avatar alikon alikon - labeled - 12 Jan 2025
avatar AK-CCM
AK-CCM - comment - 13 Jan 2025

If any docu/howto is needed:

Description: This small plugin adds a keyboard shortcut to TinyMCE to insert a non-breakable space &nbsp; at the cursor position or selection with the key combination Ctrl + Shift + Space bar - as you know it from Microsoft Word and LibreOffice Writer.

Step 1: Download the archive shortcut-nonbreaking.zip from the issue on Github.

Step 2: Unzip the ‘shortcut-nonbreaking’ folder which containing the plugin files and upload it to the /media/plg_editors_tinymce/js/plugins directory.

Step 3: Open the settings of the TinyMCE plugin (System > Manage: Plugins > Editor - TinyMCE) and include the plugin at ‘External Plugin URLs’:

  • Plugin name: shortcut-nonbreaking
  • Path: /media/plg_editors_tinymce/js/plugins/shortcut-nonbreaking/plugin.min.js.gz (or the file plugin.min.js if gzip compression is not supported)

Don't forget to save and clear the cache (System > Maintenance: Clear Cache).

avatar AK-CCM
AK-CCM - comment - 13 Jan 2025

If this feature can be merged to Joomla, the docu could be changed as below:

English language

  • Before: A list of available keyboard shortcuts (pc, mac) within the editor body.

  • After: A list of available keyboard shortcuts (pc, mac) within the editor body plus the additional key combination Ctrl + Shift + Space to insert a non-breaking space &nbsp; at the current cursor position or selection.

German language

  • Before: Die verfügbaren Tastaturkürzel (PC, Mac) für den Beitragsinhalt (en).

  • After: Die verfügbaren Tastaturkürzel (PC, Mac) für den Beitragsinhalt (en) sowie die zusätzliche Tastenkombination Strg + Umschalt + Leertaste zum Einfügen eines geschützten Leerzeichens &nbsp; an der aktuellen Cursor-Postion oder Auswahl.

avatar AK-CCM AK-CCM - change - 20 Jan 2025
Status New Closed
Closed_Date 0000-00-00 00:00:00 2025-01-20 20:46:20
Closed_By AK-CCM
avatar AK-CCM AK-CCM - close - 20 Jan 2025

Add a Comment

Login with GitHub to post a comment