L
L
Lyubimoff2021-03-24 13:09:10
TinyMCE
Lyubimoff, 2021-03-24 13:09:10

How to properly install the tinyMCE plugin?

I am trying to install TinyMCE on my site The

table, link and media plugins are not working. i.e. the popup window is open but I can't enter a value in the field
- It's like it's disable. There is only one error in the console - please use the List plugin along with the Advanced List plugin.

I saw a topic that Bootstrap and Tiny may conflict, but the code from there did not help me. How to make plugins work?

Website (if you select 3 in the select, Tiny will open)

Code

<script>
    tinymce.init({
   selector: 'textarea#default',
   language: 'ru',
   menubar: 'edit insert',
   toolbar: 'advlist image code link imagetools advcode media powerpaste codesample',
   plugins: 'advlist image code link imagetools advcode media powerpaste codesample',
   default_link_target: '_blank',
   image_list: [
    {title: 'My image 1', value: 'https://www.example.com/my1.gif'},
    {title: 'My image 2', value: 'http://www.moxiecode.com/my2.gif'}
  ]
});
  </script>

Answer the question

In order to leave comments, you need to log in

1 answer(s)
L
Lyubimoff, 2021-03-25
@Tipo_4ek

I'll leave it for history. The case of using TinyMCE in a bootstrap modal/dialog is described in the documentation... Yes, they conflict.
What should I do to restore functionality of plugins inside the bootstrap modal?
You will need to override the inline-block on focusinthe Bootstrap dialog with this code:

// Prevent Bootstrap dialog from blocking focusin
$(document).on('focusin', function(e) {
  if ($(e.target).closest(".tox-tinymce, .tox-tinymce-aux, .moxman-window, .tam-assetmanager-root").length) {
    e.stopImmediatePropagation();
  }
});

https://www.tiny.cloud/docs/integrations/bootstrap...

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question