What are our options for WYSIWYG editors in BS5?

With Summernote not being available for BS5 what are people using? I am in a real bind now. I started a new project with BS5 and now I have no text editor. :frowning:

What is our options? Just the very limited Medium editor?

Well you can add summernote lite in Bootstrap 5.

1 Like

I have tried Summernote Lite. It doesn’t add any editing buttons. And it doesn’t have the BS5 styling either.

<textarea id="editor1" name="editor1" is="dmx-summernote" dmx-bind:toolbar="[['style',['style']],['font',['bold','underline','clear']],['fontname',['fontname']],['color',['color']],['para',['ul','ol','paragraph']],['table',['table']],['insert',['link','picture','video']],['view',['fullscreen','codeview','help']]]"></textarea>

Screen Shot 2022-04-15 at 2.39.25 PM

I think it only shows up normally in the browser and not in the preview in Wappler I maybe wrong

1 Like

Disregard, I had to do a full publish. It works now. Thanks!

1 Like

It would be nice if we could convert a BS5 textarea to Summernote Lite. Copy and pasting the attributes works but would be nice to be able to just convert to Summernote.

But it works this way so I am good. I can keep working. :slight_smile:

TinyMCE is a great alternative with a bunch of plugins, it’s also very easy to implement with Wappler (especially when it comes to image uploading).

I’ve found Summernote is a bit buggy when it comes to putting random new lines and spaces. And if you plan on using image uploading, not having drag/drop support for other than base64 is a real killer. If that’s important to you, I’d recommend switching.

1 Like

Why copy and paste anything? Just add a summernote lite text area instead of a regular textarea :slight_smile:

So it looks like the rest of the form and takes up the width of it's container. The plain summernote lite textarea has no label, no help text and does not take up the width of it's container. If I have a textarea with only three buttons like I usually do the text area is so narrow it only fits two or three words in a line.

Well Brad you can just add a .form-control class to it, so it has the same styling as the rest of the Bootstrap form inputs.