Как автоматически перенести строку в TinyMCE при вставке изображения?

Есть такая проблема… она воспроизводится даже в форме написания этого поста. Если вставлять картинку через редактор TinyMCE, то не происходит автоматический перевод строки после изображения. Поле ввода после изображения не позволяет поставить в себя курсор. Если нажать ENTER, то вставленное в пост изображение удаляется (здесь тоже воспроизводится). На компе конечно можно нажать стрелочку вправо, а потом ENTER, и тогда строка перенесется (но пользователь до этого не додумается). А на телефоне клавиатуры вообще нет, поэтому оставить текст ниже изображения просто невозможно. Можно ли как-то заставить редактор переносить строку после изображения автоматически?

Другими редакторами пользоваться не могу, т.к. из всех доступных только TinyMCE вставляет изображения в комментарии кликабельными.

Redactor после изображения позволяет кликнуть в поле ввода и писать, но вставленные через него изображения не кликабельны (не увеличиваются по нажатию)

Попробовал вставить после кода изображения <br>, tinymce преобразовал его в

<p>&nbsp;</p>

 и сделал перенос строки. Вопрос, как его заставить добавлять в конце этот самый nbsp автоматически?

Пробую выбирать в настройках «Перевод каретки — <br>», но он его не вставляет, просто убирает <p>

Также попробовал дописать в настройки TinyMCE:

'force_br_newlines'     => true,
'force_p_newlines'     => false,
'convert_newlines_to_brs'     => true,
'force_br_newlines'     => true,

Ничего не изменилось.

Так и не смог разобраться. С телефона грузить картинки просто нереально.

На стандартном шаблоне. Проблема воспроизводится везде, даже тут.

Прикладываю пикчу, проблему указал стрелочкой.

Проблема состоит в том, что в TinyMCE невозможно поставить курсор ниже изображения с телефона, и с ПК кликом мышки. В Redactor можно.

Пробовал перенести настройки с TinyMCE для DLE, где курсор после изображения ставится нормально, но не разобрался.

В общем оказывается эту проблему я решал со «Спойлерами», она была ранее, сейчас вроде пофиксили. Поковырявшись в файлах я нашел строку которой нужно добавить тег <br> для того чтобы после вставки изображения создавалась ещё одна пустая строка.

Открываем файл wysiwyg/tinymce/files/tinymce.min.js

в поиске ищем строку 

{e.innerHTML='<br data-mce-bogus="1">'}

и меняем на

{e.innerHTML='<br><br data-mce-bogus="1">'}

Сохраняем.

Чистим кеш JS.

В случае обновление системы данную процедуру нужно будет обязательно повторить.

В настройках пресетов Wysiwyg «Перевод каретки» должен быть выбран Тег <p>

Вставка изображения должна происходить строго с новой строки, если вы попытаетесь вставить изображение на той строке где есть текст новая строка под изображением не создастся.

Это костыль, но рабочий. Надеюсь кто-то из разработчиков подскажет более правильное решение.

CEH9I, спасибо, частично помогло, но почему-то не действует в комментариях. А с телефона я проверить не смог, вылезает «ошибка инициализации плагина image», видимо я вчера что-то накрутил. Хотя попробовал перезалить и перезаписать все файлы TinyMCE, все равно эта ошибка на телефоне, и соответственно с телефона кнопки загрузки изображения в редакторе нет. Чуть позже попробую на чистой установке.

В-общем, увеличил абстрактный счетчик и почистил кэш на телефоне, и удалось проверить. С телефона тоже — в комментариях не работает, в самом создании или редактировании поста — работает.

CEH9I, спасибо, частично помогло, но почему-то не действует в комментариях. А с телефона я проверить не смог, вылезает «ошибка инициализации плагина image», видимо я вчера что-то накрутил. Хотя попробовал перезалить и перезаписать все файлы TinyMCE, все равно эта ошибка на телефоне, и соответственно с телефона кнопки загрузки изображения в редакторе нет. Чуть позже попробую на чистой установке.

В-общем, увеличил абстрактный счетчик и почистил кэш на телефоне, и удалось проверить. С телефона тоже — в комментариях не работает, в самом создании или редактировании поста — работает.

А вы один и тот же пресет используете? Может другой? 

Проверил, в общем нужно чтобы была пустая строка перед загрузкой картинки или текст. Если сразу грузить картинку то да, новой строки нет. Попробую ещё покопаться.

Здесь вроде нет такой проблемы, хотя раньше, вроде что-то такое было да. Вот, вставил и пишу.

Проблема воспроизводится везде, даже тут.

Но здесь как раз используются теги <p> и на демо самого Tiny

Возможно стоит посмотреть настройки здесь: www.tiny.cloud/docs/plugins/opensource/image/ или посмотреть что по стилям у вас, к примеру float, margin и ширина изображения (если она в редакторе на 100%), ну и в консоли посмотреть ошибки, есть — нету

Здесь вроде нет такой проблемы, хотя раньше, вроде что-то такое было да. Вот, вставил и пишу.

Есть, прямо в этой теме. Ошибок в консоли нет. Вставить и я могу. Но чтобы писать после вставленного изображения, приходится жать вправо, потом ENTER. Иначе никак. Если вставить изображение и нажать ENTER или SHIFT+ENTER, чтобы перейти на новую строку и начать писать, изображение просто удаляется. Конкретно воспроизводится и здесь, и на чистой установке InstantCMS. Браузер Firefox 116.0.3 (самая свежая версия)

В файле wysiwyg\tinymce\files\plugins\image\plugin.min.js ищем строку

r.dom.setAttrib(t,"data-mce-id","__mcenew"),r.focus(),r.selection.setContent(t.outerHTML);

и меняем на это

r.dom.setAttrib(t,"data-mce-id","__mcenew"),r.focus();let nb=r.dom.create('br').outerHTML+r.dom.create('br').outerHTML;if(r.settings.forced_root_block&&r.settings.forced_root_block!=='br'){nb=r.dom.create(r.settings.forced_root_block).outerHTML;}r.selection.setContent(t.outerHTML+nb);

Loadырь, большое спасибо, работает даже в комментариях. Правда перед вставленной картинкой, если нет текста, кликать оказывается нельзя. Но уже гораздо лучше.

Оказывается такая проблема с невозможностью клика есть еще и со вставкой видео с Youtube, но ее я сам смог разобраться как решить (там гораздо проще). Вдруг кому пригодится, в файле wysiwyg/tinymce/files/plugins/media/plugin.min.js нужно найти:

<iframe src="'+n.source+'" width="'+n.width+'" height="'+n.height+'"'+l+"></iframe>

и обернуть в «p» и «br», чтобы стало так:

<br><p><iframe src="'+n.source+'" width="'+n.width+'" height="'+n.height+'"'+l+"></iframe></p><br>