wysiwyg-rails provides the Froala WYSIWYG HTML Editor javascript and stylesheets as a Rails engine for use with the asset pipeline.
Add this to your Gemfile:
gem "wysiwyg-rails"and run bundle install.
In your application.css, include the css file:
/*
*= require froala_editor.min.css
*= require froala_style.min.css
*= require font-awesome
*/If you want to use the dark theme, then you have to include themes/dark.min.css file too.
In your application.js, include the JS file:
//
//= require froala_editor.min.js
//If you need to use any of the Available Plugins, then you should include those too in your application.js and application.css.
// Include other plugins.
//= require plugins/align.min.js
//= require plugins/char_counter.min.js
//= require plugins/code_beautifier.min.js
//= require plugins/code_view.min.js
//= require plugins/colors.min.js
//= require plugins/emoticons.min.js
//= require plugins/entities.min.js
//= require plugins/file.min.js
//= require plugins/font_family.min.js
//= require plugins/font_size.min.js
//= require plugins/fullscreen.min.js
//= require plugins/image.min.js
//= require plugins/image_manager.min.js
//= require plugins/inline_style.min.js
//= require plugins/line_breaker.min.js
//= require plugins/link.min.js
//= require plugins/lists.min.js
//= require plugins/paragraph_format.min.js
//= require plugins/paragraph_style.min.js
//= require plugins/quick_insert.min.js
//= require plugins/quote.min.js
//= require plugins/save.min.js
//= require plugins/table.min.js
//= require plugins/url.min.js
//= require plugins/video.min.js/*
*= require plugins/char_counter.min.css
*= require plugins/code_view.min.css
*= require plugins/colors.min.css
*= require plugins/emoticons.min.css
*= require plugins/file.min.css
*= require plugins/fullscreen.min.css
*= require plugins/image_manager.min.css
*= require plugins/image.min.css
*= require plugins/line_breaker.min.css
*= require plugins/quick_insert.min.css
*= require plugins/table.min.css
*= require plugins/video.min.css
*/Similar, if you want to use language translation you have to include the translation file.
// Include Language if needed
//= require languages/ro.jsThen restart your web server if it was previously running.
Details about initializing the editor can be found in the Froala WYSIWYG Editor official documentation.
The wysiwyg-rails project is under MIT license. However, in order to use Froala WYSIWYG HTML Editor plugin you should purchase a license for it.
Froala Editor has 3 different licenses. For details please see License Agreement.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent