TinyMCE Support

Wappler already has support for Summernote, however, Summernote is old and contains quite a few bugs, or missing features such as drag+drop support uploads (outside Base64).

A handful of users already use TinyMCE in their Wappler projects, including myself, as it’s quite simple to setup but it would be really nice to have this as a native integration in Wappler. The open source free version doesn’t require a signup, either. There’s also a crazy amount of plugins that are much better than summernotes.

Bump++

Quill probably fits better with Wappler.

2 Likes

As TinyMCE recently switched to MIT license and also are reworked their code base to the latest standards and browsers, it will definitely be a huge gain to integrate with Wappler, as native App Connect component.

So @patrick can check it out.

7 Likes

I didn’t know that! Good for them!

Edit: Just three weeks ago. You are on top of everything :smiley:

4 Likes

Quill is also an excellent choice for developers

Would love to see this. I’m trying to implement it now, but there’s a lot of areas to wire up.

I would love to see this. Summernote Lite and Medium Editor just don’t have the same appeal. I would convert my Summernote Lite inputs to TinyMCE in a heartbeat.

2 Likes

I’ve been waiting for ages for this to materalise, I use Summernote and don’t like it at all, TinyMCE is the way to go.

You can use the JS below if you’d like. I’ve been using it for a few years now. It handles getting TinyMCE to work along with image uploads. This is, however, being used on an older version of TinyMCE, so it might need some tweaks for the latest versions.

Use $_POST.file within Wappler’s “File Upload”. Use “Set Value” with the name “url” and the value as the image URL, and output this. That’ll ensure the URL is updated in TinyMCE correctly.

1 Like

Thanks @Digo. I think the idea of having it fully integrated would allow us to more easily work with dynamic attributes and events across elements.

For instance, I want to have a submit button disabled until there is text in the tinymce field.

May be me oversimplifying as i have not tested this further, just done a quick integration but

  1. add
<script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/5.2.2/tinymce.min.js"></script>

to your head/ layout page

  1. add
<script>
    document.addEventListener('DOMContentLoaded', function() {
    tinymce.init({
        selector: 'textarea', // Use the appropriate selector for your text area
        // Other TinyMCE configuration options
    });
});
</script>

to the foot of your page/ content page

Tiny runs in a textarea

Parameters are passed within the init() function of the code

you can also customise the selector name by overwriting “textarea”

Btw we are already busy for some time with TinyMCE as App Connect component and greater integration in Wappler. So it is coming up, probably shortly after the Wappler 6 release.

14 Likes

I know you don’t like to quote timescales @George… but my users are really struggling with Summernote, and I need to move over to something else by the end of this year… do you think you will have TinyMCE integrated by then? :thinking:

4 Likes

I’m interested in this too, we’ve used Summernote for years and put up with its terrible integrations, really looking forward to ditching it forever.

3 Likes

Bumps!

3 Likes

Bump

Something better may be on the horizon: