Replace Rich Text Editor with summernote does not seem to work
Made some more changes and now the summernote toolbar appears correctly but only bullet formatting works. The new codepen is here. @artf Any pointers would be greatly appreciated.
Read full answer below ↓Question
I am trying to replace the default RTE in grapesjs with summernote. I got some help from the author of summernote and got this codepen to work somewhat, but the summernote author concluded that: But grapejs p element is a content in iframe. In other words, there is a structure where a p tag exists in an iframe and ui must exist outside. Summernote is a structure that hides the element and puts the tag of summernote. It seems difficult to use because the rest of the resources of summernote are not loaded in the iframe. I prefer summernote over TinyMCE or CKEditor since it is "MIT license". Has...
Answers (3)
Made some more changes and now the summernote toolbar appears correctly but only bullet formatting works. The new codepen is here. @artf Any pointers would be greatly appreciated.
@wfcheng Did you ever get anywhere with this? The codepen includes the canvas script/styles which adds the resources inside the iframe, so I was a little confused what summernote author was referring to.
@timramseyjr I ended up just adding more buttons to the RTE toolbar to allow applying font styles and color on selected text, even though the grapesjs documentation recommends to use the style manager. I found that it is more user friendly to have them on the toolbar.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #2337
[BUG / QUESTION] Deleting default styles does not work
Hello, i'm trying to delete some of the default styles of the blocks. I wrote everything I changed in a plugin. I used this function to upd...
Issue #4083
Set root does not work
GrapesJS version[X] I confirm to use the latest version of GrapesJSWhat browser are you using? Safari 15.0Reproducible demo link https://js...
Issue #4449
Lists not working with default RTE
GrapesJS version [X] I confirm to use the latest version of GrapesJS What browser are you using? Chrome Version 102.0.5005.115 (Official Bu...
Issue #6654
the rich-text editor cannot be activated
GrapesJS version [x] I confirm to use the latest version of GrapesJS What browser are you using? chrome v91 Reproducible demo link https://...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins →Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.
Browse premium plugins →Related tutorials
In-depth guides on the same topic.
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.