Как я могу вставить изображение в tinymce?

Tinymce позволяет добавлять изображение, ссылаясь на URL-адрес. Для обычного пользователя, который, вероятно, даже не знает, что такое URL, это слишком утомительно. У них есть изображение на компьютере, и оно должно быть встроено в html-текст. Есть ли простой способ добиться этого с помощью tinymce?

Плагин для загрузки файлов в этом конкретном случае не поможет, потому что редактор tinymce работает локально. Изображение действительно должно быть встроено в html-текст.


person Ola Eldøy    schedule 30.08.2011    source источник


Ответы (2)


Вам нужно убедиться, что в файле tinymce init valid_elements и valid_children настроены правильно. Как вы хотите, чтобы пользователь вставил изображение? (нажатие кнопки, перетаскивание,...)

Чтобы вставить изображение через API tinymce, вы можете использовать:

editor.execCommand('mceInsertContent', false, '<img src="images/myimage.jpeg" height="12" width="12" />');

Я настоятельно рекомендую вам загрузить версию для разработчиков tinymce и внимательно изучить файлы tiny_mce/themes/advanced/editor_template_src.js и tiny_mce/themes/advanced/charmap.html. Если возможно, найдите исходный код для «charmap». Вместо вставки символа вам нужно будет вставить html-код изображения.

person Thariama    schedule 30.08.2011
comment
Я хотел бы использовать кнопку вставки изображения. Конечно, перетаскивание было бы здорово! Но кнопку, вероятно, легче обнаружить, и для этого не потребуется специальной подготовки. - person Ola Eldøy; 01.09.2011
comment
так что в этом случае нажатие кнопки вставит одно изображение (то же самое) или вызовет диалог для выбора одного? - person Thariama; 01.09.2011
comment
Диалог для выбора файла при нажатии кнопки вставки изображения — это то, к чему я стремлюсь. - person Ola Eldøy; 01.09.2011
comment
Вы должны взглянуть на кнопку charmap (расширенная функция). Это хорошая отправная точка. Смотрите мой отредактированный пост. - person Thariama; 01.09.2011
comment
Спасибо, Тариама. То, что вы описываете, звучит как правильный путь. К сожалению, я не работаю с Javascript каждый день, поэтому, возможно, я не смогу потратить время, необходимое для реализации этой функции самостоятельно. Возможно, на данный момент я помогу клиентам вставлять изображения вручную. Спасибо за указатели! - person Ola Eldøy; 05.09.2011

Я создал плагин, который можно найти здесь ( https://github.com/buddyexpress/bdesk_photo)

В плагине есть некоторые ограничения, такие как:

  • Размер изображения должен быть не более 500 КБ.
  • Размер изображения должен быть равен или меньше 800x800.
person Leonard    schedule 27.02.2014