Froala Editor

Froala WYSIWYG HTML Editor is one of the most powerful JavaScript rich text editors ever.

Slim - only add the plugins that you need (30+ official plugins)
Client frameworks integrations
Server side SDKs for PHP, Node.JS, .NET, Java, and Python
Code is well commented
Online documentation up to date
Simple to extend - the plugins are all well commented and simple to use as a basis for your own plugins
Well maintained - frequent releases
Great support - Help Center

Demos

Basic demo: https://www.froala.com/wysiwyg-editor
Inline demo: https://www.froala.com/wysiwyg-editor/inline
Full list: https://www.froala.com/wysiwyg-editor/examples

Get Started

Froala WYSIWYG HTML Editor requires jQuery 1.11.0 or higher and the iconic font named Font Awesome 4.4.0. You may also use older versions of Font Awesome, but some of the editor's icons will not appear.

<!-- Include CSS for icons. -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />

<!-- Include Editor style. -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.5.1/css/froala_editor.pkgd.min.css" rel="stylesheet" type="text/css" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.5.1/css/froala_style.min.css" rel="stylesheet" type="text/css" />

<!-- Create a tag that we will use as the editable area. -->
<!-- You can use a div tag as well. -->
<textarea></textarea>

<!-- Include jQuery lib. -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<!-- Include Editor JS files. -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.5.1//js/froala_editor.pkgd.min.js"></script>

<!-- Initialize the editor. -->
<script>
  $(function() {
    $('textarea').froalaEditor()
  });
</script>

For more details on customizing the editor, please check the editor documentation.

Download

npm: npm install froala-editor
bower: bower install froala-wysiwyg-editor
CDN: https://cdnjs.com/libraries/froala-editor
Angular JS: https://github.com/froala/angular-froala
Angular 2: https://github.com/froala/angular2-froala-wysiwyg
Aurelia: https://github.com/froala/aurelia-froala-editor
CakePHP: https://github.com/froala/wysiwyg-cake
Django: https://github.com/froala/django-froala-editor
Ember: https://github.com/froala/ember-froala-editor
Knockout: https://github.com/froala/knockout-froala
Meteor: https://github.com/froala/meteor-froala
Ruby on Rails: https://github.com/froala/wysiwyg-rails
React JS: https://github.com/froala/react-froala-wysiwyg/
Reactive: https://github.com/froala/froala-reactive
Symfony: https://github.com/froala/KMSFroalaEditorBundle
Vue JS: https://github.com/froala/vue-froala-wysiwyg/
Yii2: https://github.com/froala/yii2-froala-editor
Wordpress: https://github.com/froala/wordpress-froala-wysiwyg

Browser Support

At present, we officially aim to support the last two versions of the following browsers:

Chrome
Edge
Firefox
Safari
Opera
Internet Explorer 10+
Safari iOS
Chrome, Firefox and Default Browser Android

Resources

Demo: www.froala.com/wysiwyg-editor
Download Page: www.froala.com/wysiwyg-editor/download
Documentation: froala.com/wysiwyg-editor/docs
License Agreement: www.froala.com/wysiwyg-editor/terms
Support: wysiwyg-editor.froala.help
Issues Repo guidelines

Reporting Issues

We use GitHub Issues as the official bug tracker for the Froala WYSIWYG HTML Editor. Here are some advices for our users that want to report an issue:

Make sure that you are using the latest version of the Froala WYSIWYG Editor. The issue that you are about to report may be already fixed in the latest master branch version: https://github.com/froala/froala-wysiwyg/tree/master/js.
Providing us reproducible steps for the issue will shorten the time it takes for it to be fixed. A JSFiddle is always welcomed.
Some issues may be browser specific, so specifying in what browser you encountered the issue might help.

Technical Support or Questions

If you have questions or need help integrating the editor please contact us instead of opening an issue.

Licensing

In order to use the Froala Editor you have to purchase one of the following licenses according to your needs. You can find more about that on our website on the pricing plan page.

itdavidhan/wysiwyg-editor