The following guide explains how to achieve most popular features from TinyMCE in Froala Editor. For each of them, we put together a jsFiddle and a GIF showing the functionality.
This example highlights the most used features.
Similary to the TinyMCE Distraction-free editor option, Froala WYSIWYG HTML Editor comes with inline toolbar which makes it easy to edit inline without any external distractions.
Inline editing is one of the most appreciated features in Froala Rich Text Editor. It enables editing the page in a true WYSIWYG manner without any external elements.
Although the Froala Editor comes with a lot of built-in features, many times - just like in TinyMCE - we need to create new buttons in the toolbar. This example highlights how to add a new button which inserts custom HTML.
Another very common use-case that WYSIWYG editors have is to create a custom toolbar dropdown. This can be achieved in a similar manner to the toolbar button.
Froala Editor comes with an easy to use UI that always deliver a great editing experience without cutting corners. The image editing is one of the most used and loved features which always adds a plus when compared to other editing solutions.
Although inserting images as base64 can be easily achieved, our recommendation is to use images that are loaded from an URL. This might be tempting at a first glance because you don't have to deal with all the image storage, but you will get in troubles quickly. Here are the top 2 reasons for doing that when you're using a WYSIWYG HTML editor:
1. browser tend to slow down when images are inserted as base64 because they have to process very large chunks of HTML;
2. when you save the content, you'll pass a lot of data to your server and that would result in an unwanted overload.