Как реализовать Rich Text Editor с возможностью загрузки изображений в любом месте текста - PullRequest
1 голос
/ 15 июня 2011

Я хотел бы реализовать RTE (Rich Text Editor) с возможностью загрузки изображений в любом месте текста. Моя цель - создать страницу «Добавить / отредактировать новостную статью», где клиент может написать историю с изображениями.

Я хорош в программировании на PHP и Javascript, поэтому я ищу справку о методах реализации этого. Создаю ли я пользовательскую кнопку в этом RTE, чтобы вставить ранее загруженное изображение или каким-либо другим способом? Как отобразить эти изображения для выбора пользователем? И т.д.

Бонусные баллы за:

  • Загрузка нескольких файлов: возможность выбора клиентом, например 10 изображений, которые имеют отношение к этой истории.
  • Для загрузки используется метод, отличный от Flash, по умолчанию.
  • Использует jQuery, так как я часто его использую.
  • RTE очень легкий. Мне все равно, если клиент должен знать несколько вещей (например, уценка или что-то подобное), я просто не люблю раздутые RTE.
  • Используются новые технологии, такие как HTML5 и / или CSS3.

Позвольте мне уточнить несколько вещей. Я знаю несколько Javascript RTE, а также использовал в нескольких CMS. Так что мне не нужны ссылки на них, я могу сам Google "javascript RTE" :). Тем не менее, что-то вроде @hakre говорит, что является полезным, поскольку он указал, насколько расширяемый CKEditor, о котором я не знал полностью.

Чтобы привести пример ответа, который я ищу: «Вы можете сделать это с CKEditor, загружать изображения асинхронно с помощью jquery-html5-upload, сохранять все загруженные файлы изображений в массиве Javascript, создавать новую кнопку внутри CKEditor с помощью специального обработчика щелчков, который отображает наложение с Fancybox, и вы показываете все изображения (имена файлов хранятся в массиве), пользователь щелкает изображение и вставляет html в редактор ".
Нечто подобное, но лучше :) (или, точнее, точнее).

Ответы [ 3 ]

3 голосов
/ 16 июня 2011

Есть что-нибудь здесь, что встречает ваши требования? http://ckeditor.com/developer-features

0 голосов
/ 16 июня 2011

«Ложный ответ», который вы дали себе, довольно точен. Вам понадобится редактор RTE, который поддерживает пользовательские функции.

Логистика будет идти по следующим направлениям:

  1. Пользователь нажимает кнопку
  2. К входу добавляется пустой div с уникальным идентификатором
  3. Откроется всплывающее окно загрузки изображений с указателями на новый div
  4. Комбинация jQuery / AJAX / PHP позволит пользователю загрузить файл на странице
  5. Имя файла возвращается после процесса загрузки и вставляется в первоначально добавленный div

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

0 голосов
/ 16 июня 2011

Вы взглянули на TinyMCE или CKEditor ?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...