The tinyMCE cursor is placed in the middle of the text after clicking a button

In WordPress, I have an operating shortcode button in my editor that I would like to add two short code tags (one start and one at the end) around the last cursor location after a single click, I could not find the previous Q & A on this topic , and I referenced the TinyMCE documentation for Command Identifiers . Here is my shortcode.js file:

(function() { tinymce.PluginManager.add('foobar', function(editor, url) { editor.addButton('foobar', { title : 'This is just a test', text : '<foobar>', icon : false, onclick : function() { editor.execCommand( "mceInsertContent", false, '[foobar][/foobar]' ); } }); }); })(jQuery); 

So, after clicking the <foobar> button, it generates:

 <foobar></foobar>cursor is here 

with the cursor starting after closing </foobar> . Am I using the wrong approach in the editor? This may be a related question, but is there even a way if I want to create another short code that adds three lines, for example:

 <foobar> <!-- Cursor lands here </foobar> 

What is the appropriate command to control cursor position in tinyMCE?

+5
source share

Source: https://habr.com/ru/post/1257766/


All Articles