Content editors using contenteditable
On the last Web Standards Days, held in Moscow, Anton Nemtsev told about the idea of editing content directly on the page with this content, using the contenteditable attribute.
Asking google, I found two quite working editors, which you can try to apply in one of the projects.
Position themselves as an analogue of TinyMCE or CKEditor, but embedded directly on the page for use with certain blocks of content.
')
The demo looks quite attractive - a panel appears at the top of the page, and the editable blocks are highlighted in the content.
On the site, the editor is served as a gem for RoR, but there is a link to the project's wiki on Github, where it is written how to use it without RoR.
Declared support for Firefox 4+, Chrome 10+, Safari 5+
The concept is the same - the areas available for editing are highlighted and when you click on them, a panel with buttons arrives.
Initially it looks poorer than Mercury Editor, but the site has about two dozen plug-ins that extend the functionality - for example, a plugin for inserting images and editing their attributes.
I did not find explicitly supported versions of browsers, but I learned by experience that it, just like Mercury Editor, works in Firefox and Webkit + in IE9.
UPDATE , based on comments:
NicEdit - I saw him when I was looking, but for some reason the demos didn’t impress me. Although he is quite worthy of attention.
Visual editor on jQuery from Imperavi. Minimalistic editor with a nice design. Externally, I liked the functionality is not rich, but quite sufficient.
Best In Place - a super-minimalistic editor that only allows you to edit content - you can use it if you need to edit the data entered earlier in forms with a certain set of parameters.
Asking google, I found two quite working editors, which you can try to apply in one of the projects.
Mercury editor
Position themselves as an analogue of TinyMCE or CKEditor, but embedded directly on the page for use with certain blocks of content.
')
The demo looks quite attractive - a panel appears at the top of the page, and the editable blocks are highlighted in the content.
On the site, the editor is served as a gem for RoR, but there is a link to the project's wiki on Github, where it is written how to use it without RoR.
Declared support for Firefox 4+, Chrome 10+, Safari 5+
Aloha editor
The concept is the same - the areas available for editing are highlighted and when you click on them, a panel with buttons arrives.
Initially it looks poorer than Mercury Editor, but the site has about two dozen plug-ins that extend the functionality - for example, a plugin for inserting images and editing their attributes.
I did not find explicitly supported versions of browsers, but I learned by experience that it, just like Mercury Editor, works in Firefox and Webkit + in IE9.
UPDATE , based on comments:
NicEdit - I saw him when I was looking, but for some reason the demos didn’t impress me. Although he is quite worthy of attention.
Visual editor on jQuery from Imperavi. Minimalistic editor with a nice design. Externally, I liked the functionality is not rich, but quite sufficient.
Best In Place - a super-minimalistic editor that only allows you to edit content - you can use it if you need to edit the data entered earlier in forms with a certain set of parameters.
Source: https://habr.com/ru/post/136599/
All Articles