Подскажите WYSIWYG-редактор для CMS

https://github.com/JefMari/awesome-wysiwyg-editors

Тут еще до выбора редактора нужно определится с концепцией. Возможно будет лучше взять маркдаун. Если html, то CKEditor наверное самый популярный и фичастый, но не стоит давать пользователю слишком много воли, а то они будут делать вырвиглазные радужные тексты.

WYSIWYG полный отстой, постоянно все съезжает, не так форматируется. Я бы просто сделал bbcode заменой на теги, и возможность предпросмотра поста. Загрузку картинок можно сделать кнопкой загрузки файла которая после успешной загрузки вставляет ссылку на картинку в позиции курсора текстового поля.

Если все же нужен WYSIWYG, то я не знаю легковесных и вменяемых, я бы сам на базе contenteditable сделал как надо. Не так уж и много там нужно, вставку картинок, форматированного текста и редактирование уже предоставляет сам браузер.

не стоит давать пользователю слишком много воли

Это свой блог-шпаргалка, так сказать творение очередного сисадмина дилетанта. Делаю наподобие этого. Наполнять контентом буду исключительно только я. Возможно в будущем прикручу комментарии.

Маркдаун - есть ли какая-то панель, чтоб не прописывать теги при оформлении контента?

Маркдаун - есть ли какая-то панель, чтоб не прописывать теги при оформлении контента?

Маркдаун не знаю, хорошую разметку так не назовут. А для bbcode ты уж точно сам справишься.

<div class="bb-panel">
  <button onclick="formatText('b')">Жирный [b]</button>
  <button onclick="formatText('i')">Курсив [i]</button>
</div>
<textarea id="mytextarea"></textarea>

function formatText(tag) {
   var Field = document.getElementById('mytextarea');
   var val = Field.value;
   var selected_txt = val.substring(Field.selectionStart, Field.selectionEnd);
   var before_txt = val.substring(0, Field.selectionStart);
   var after_txt = val.substring(Field.selectionEnd, val.length);
   Field.value = before_txt + '[' + tag + ']' + selected_txt + '[/' + tag + ']' + after_txt;
}

Я бы просто сделал bbcode заменой на теги, и возможность предпросмотра поста.

Оу! Это идея! Мне по идее реализовать необходимый минимум - жирный, ссылка, код, цитата… Вот только не совсем понимаю как панельку в форму textarea прикрутить

Блин, ты быстрее пули =) я пока ответ писал, ты уже ответил на него =)

СПАСИБО! Буду пробовать

А выше дал пример, принцип простой, JS вырезает текст ДО выделения, само выделение, и ПОСЛЕ выделения, потом приклеивает теги по бокам середины, и заклевает все обратно в textarea.

Как тут можно тебе за ответ 100500 «Два чая этому господину» поставить? =)

MOPKOBKA ты просто в 3.15 решил мою проблему. Эта хрень работает! Учитывая свою склонность к минимализму - это прям лучшее решение!

Ещё раз спасибо!

Если ты джун, то напилить свой редактор самое то. Да, он будет не такой фичастый как ckeditor, так это и не нужно скорее всего и ты наоборот будешь скрывать кнопки в ckeditor-е. Ну и не так это сложно

Получилось немного вырвиглазно, но CSS’ом это облагородить и будет норм! Зато своё!

Я использовал CKEditor. Можно настроить генерировать достаточно чистый код как будто руками писал, легко прикрутить загрузку картинок через свой бекэнд. Но это если прям нужен HTML.

Я бы ещё рассматривал вариант, если не нужно сложное форматирование, хранить в БД тексты в Markdown и соответственно использовать редакторы Markdown. Профит в том, что будет проще адаптировать контент к изменению вёрстки сайта, так как ты можешь очень гибко управлять рендером.

Сейчас есть редакторы способные генерировать достаточно чистый HTML без style на каждое слово. Они просто вставляют стандартные теги h1-h6, p, a, code, blockquote, img, table, которые тебе предполагается застилизовать в своём css как хочешь. Плюс возможность применять CSS-классы.

Более того, используемые автоматически/разрешённые теги/классы обычно можно кастомизировать через настройки и плагины редактора. Можно, грубо говоря, сделать свой набор классов, из которых автор должен верстать контент (сообразно дизайн-системе сайта). И редактор будет тупо предоставлять кнопки для их применения к тексту. Ничего лишнего.

Это мощнее Markdown, в котором нет штук типа обтекания картинок текстом, выравнивания и т. д. А тут доступны все возможности CSS, но ты явно можешь на этапе настройки выбрать какие именно и как именно.

Так вы совсем юный еще, а зачем тогда в теме про голосование по дистрибутивам утверждаете, что у нас не разрабатывают софт? Впрочем, возраст многое объясняет, но становится обидно

Так вы совсем юный еще

Спасибо за комплимент, сынок! Повеселил старика =)