Editor.js - модульный визуальный редактор

О редакторе vc.ru/dev/60626-istoriya-sozdaniya-editor-js-modulnogo-vizualnogo-redaktora-ot-komandy-studentov-codex
Офф. сайт editorjs.io

Что имеем?
Многое ещё предстоит сделать… свои плагины, утилиты и т.д. ))
Сейчас работают основные плагины кроме плагинов: image и embed
В моём варианте на выходе в вёрстке используется(за исключением некоторых плагинов) bootstrap 4 и font-awesome 5.

Примеры
В редакторе prnt.sc/syqcmp
На выходе prnt.sc/syqd56


Скачать архив и опробовать в деле можно здесь
instantcms-dev.ru/files/Editor.js.zip

Установка и настройка
1 Загрузите содержимое архива в корень сайта
2 В настройках вашего поля выберите поле Поле редактора Editor.js

Важное замечание!
В базу пишется json код а не html.
Результат на выходе формируется полем. Это в будущем позволит применять разные дизайны для блоков.
Не подойдёт на замену действующему текстовому полю!

Скачать архив и попробЫвать в деле можно здесь

Вот так что то получается. Система нова, чистая.

Вот так что то получается. Система нова, чистая.

У вас на снимке отображается поле и кнопка которые я использую для отладки. Убрал это дело из архива.
Вы сейчас редактору подсовываете неверный формат данных, и скрипт ломается.
Выше написал: Не подойдёт на замену действующему текстовому полю!

Не подойдёт на замену действующему текстовому полю!

конечно можно ухитриться и при первом редактировании записи-поля с html содержанием, вписать это содержание как HTML-фрагмент… Но не думаю что это будет нужно )) Проще создать рядом новое поле для нового редактора.

Выше написал: Не подойдёт на замену действующему текстовому полю!

Ясно.Просто из написанного я не так понял.Читаю текстовое а в голове строка).

Обновил архив. Если что-то не работало, нужно обновить файлы.
п.с. Заметил что не сохраняются данные если сохранять запись не по кнопке Сохранить в конце страницы но использовать кнопку Сохранить в меню действий. Позже поправлю.

Спасибо — попробуем.

Можно и нужно такой редактор вынести за пределы формы редактирования. Например в виде виджета. Но сейчас хотелось бы сосредоточиться на деталях, функционале.

Можно и нужно такой редактор вынести за пределы формы редактирования. Например в виде виджета. Но сейчас хотелось бы сосредоточиться на деталях, функционале.

Если я правильно понял идею, то у данного редактора можно легко реализовать идею ВСЕ в ОДНОМ. То есть при создании статьи можно прямо в редакторе вставлять в тексты, в любом месте любые поля: видео, аудио, галереи и отдельные изображения, опросы, виджеты и прочий функционал имеющийся на сайте.
Сейчас это решается за счет. создания отдельных полей в перемешку с дополнительными текстовыми полями.

Если я правильно понял идею, то у данного редактора можно легко реализовать идею ВСЕ в ОДНОМ.

Не совсем. Реализовать идею "ВСЕ в ОДНОМ" вы и сейчас можете с любым wysiwyg редактором. Для этого достаточно вывести один виджет с этим редактором на странице.
Здесь же речь идет о ещё одном редакторе типа redactor. Проблема лишь в том, что данный редактор выдает данные не в html формате, а в json. Это как хорошо, так и плохо. Хорошо тем, что можно получить любой блок записи (текст, картинку, видео ролик и т. п.) но при этом надо ещё придумать что с ними делать. На этом все плюсы заканчиваются и начинаются минусы. А минусов несколько. Начиная с того, что рендер статьи в html-код происходит при выводе страницы, а не при ее создании или сохранении. А это влияет на скорость загрузки. Если такое поле будет одно на странице, то это не заметно, но если вывести виджеты списков на главной странице с сотней таких полей, то тормоза будут заметнее. Задумка автора, конечно интересная

Это в будущем позволит применять разные дизайны для блоков.

но когда это жестко прописано в самом системном файле поля, а не в шаблоне, то о гибкости можно забыть и поломать верстку при очередном обновлении поля. А целесообразность частой смены кода верстки тоже выходит под сомнение. Нужна ли она. Да нужна чтобы один раз настроить как надо для данного шаблона и забыть про это, но часто менять смысла не вижу.
Ещё минусом будет то, что данный тип поля нельзя заменить стандартным текстовым полем или полем типа "Текст HTML". В виду того, что в базу лезут разные форматы данных. Другими словами, если автор пропал на пару дней, то вы с этим полем ничего не сделаете. Решить это можно тем, что рендер записи в html код сделать при ее сохранении и в базу писать уже готовый html код, тогда и с производительностью проблем не будет и другими редакторами можно будет заменять, если этот сломается по неизвестным причинам. Но придется забыть о "разные дизайны для блоков", хотя их можно в любой момент поменять средствами css.
Да, ещё не увидел, чтобы текст проходил обработку типографом при выводе в записи.

В целом редактор не плохой.

Многое ещё предстоит сделать… свои плагины, утилиты и т.д. ))

После этого он превратит в очередной redactor, tinymce и т. п. и вся его прелесть "легкости" улетучится.

Если я правильно понял идею, то у данного редактора можно легко реализовать идею ВСЕ в ОДНОМ.

Не совсем. Реализовать идею "ВСЕ в ОДНОМ" вы и сейчас можете с любым wysiwyg редактором. Для этого достаточно вывести один виджет с этим редактором на странице.

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

как с помощью одного редактора вставить в статью кучу разных полей и виджетов

Забудьте про поля и виджеты. У вас есть супер редактор (redactor, tinymce), в который вы вставляете заголовки, текст, картинки, видео и прочее вашей будущей страницы.
Это сейчас у вас страница формируется из данных полученных из формы создания записи. Уберите все эти поля, оставьте только поле с редактором и создавайте в нем сразу всю страницу, в том виде в каком вам это нравится. Никаких ограничений для полета фантазии и прочих проблем.
А поля это лишь для тех кто хочет загнать себя в "рамки стандартизации" внешнего вида страницы, для тех кому нужны фильтрации, поиски и прочие мелочи, но никак не для тех, у кого фантазия выходит за рамки набора полей.

как с помощью одного редактора вставить в статью кучу разных полей и виджетов

Забудьте про поля и виджеты. У вас есть супер редактор (redactor, tinymce), в который вы вставляете заголовки, текст, картинки, видео и прочее вашей будущей страницы.
Это сейчас у вас страница формируется из данных полученных из формы создания записи. Уберите все эти поля, оставьте только поле с редактором и создавайте в нем сразу всю страницу, в том виде в каком вам это нравится. Никаких ограничений для полета фантазии и прочих проблем.
А поля это лишь для тех кто хочет загнать себя в "рамки стандартизации" внешнего вида страницы, для тех кому нужны фильтрации, поиски и прочие мелочи, но никак не для тех, у кого фантазия выходит за рамки набора полей.

Только ЗА! Но как в текст вставить галерею со слайдером, опрос или еще что либо, что до сих пор делали поля? Где в указанных редакторах такая возможность?

Но как в текст вставить галерею со слайдером, опрос или еще что либо, что до сих пор делали поля?

Поля до сих пор делали всё тоже — выводили нужный html код. Вы берете сами нужный вам html код (галереи, опроса, слайдера и пр.) и через кнопку "Просмотр кода" вставляете в нужном месте код. И всё никаких проблем. Тоже мне, понапридумали всяких полей упрощающих людям жизнь и работу с сайтом — зачем? .