Live preview markdown editor

Простите меня, если это был ответ. Я осмотрелся, но ничего не нашел.

Я создаю сайт для не-технарей, и это требует от них, чтобы иметь возможность добавлять форматированный текст контент. Я смотрел на Markdown для этого и хотел бы использовать это.

Я искал хороший (jquery) элемент управления ui, чтобы сделать редактирование простым, но все, что я посмотрел, имеет живой предварительный просмотр, живущий где-то еще на странице, кроме окна ввода. ( как это markitup, etc..)

Я хотел бы использовать что-то, что заставляет вас чувствовать, что вы используете текстовый процессор. Как в TinyMCE делает это, но работает на Markdown, а не HTML

есть ли что-то подобное, или, может быть, где-то, что показывает, как его построить?

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

14
markdown user-controls

4 ответов

Если я получу то, что вы ищете, то самым простым подходом было бы создать HTML с TinyMCE или CKEditor, затем примените что-то вроде Markdownify к выходу, например,tinymce.getContent().

4

с тех пор я нашел то, что я люблю. the редактор пера на Github делает только то, что я хотел. Я рад видеть, что кто-то взял это на

0

проверить Stack Edit это отличный редактор WYSIWYG markdown-синхронизируется с Google Docs, Dropbox & CouchDB, публикуется в Github (и во многих других местах) и предлагает простой обмен ссылками. Вы можете получить доступ к нему на своем веб-сайте или с помощью приложения Chrome. Вы можете создать заголовки и списки в редакторе, и он покажет вам соответствующий текст в формате markdown. Затем вы можете сохранить, опубликовать, поделиться или загрузить файл.

0

Markdown не будет совместим с редактором WYSIWYG. Рассмотрим этот пример Markdown:

Let's link to [Google][].

  [Google]: http://www.google.com/

если вы делали редактор WYSIWYG, что произойдет после того, как вы набрали [Google]? Вы видите синий подчеркнутый текст? Вы только посмотрите [Google] поскольку это еще не действительная гиперссылка? Как насчет после ввода трейлинга []? Это все еще не полностью определенная гиперссылка; вы не можете щелкнуть по ней, потому что Markdown не знает, где она связывается.

и как делает пользователь введите это [Google]: http://www.google.com/ последующие строки? Эта строка не отображается; это разметка; она невидима. Где вы вводите невидимый текст в Редактор WYSIWYG?

-4