- Notifications
You must be signed in to change notification settings - Fork103
Ruby gem for Froala jQuery WYSIWYG HTML Rich Text Editor.
License
froala/wysiwyg-rails
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
wysiwyg-rails provides theFroala 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 runbundle install.
In your index.html.erb add
<script type="text/javascript" src = "../../assets/froala_editor.pkgd.min.js"></script>To use third-party plugins add
<script type="text/javascript" src = "../../assets/third_party/font_awesome.min.js"></script><script type="text/javascript" src = "../../assets/third_party/embedly.min.js"></script><script type="text/javascript" src = "../../assets/third_party/image_tui.min.js"></script><script type="text/javascript" src = "../../assets/third_party/spell_checker.min.js"</script>Initialize editor by adding below in body of index.html.erb
new FroalaEditor('#edit', { })You can pass options to editor by including these in index.html.erb
new FroalaEditor('#editor', {options : value});In yourapplication.css.scss, include the css file:
/* @import "froala_editor.min"; @import "froala_style.min"; */
If you want to use the dark theme, then you have to includethemes/dark.min.css file too.
In yourapplication.js.coffee, include the JS file:
#= require froala_editor.min.jsnewFroalaEditor('selector',{ });
If you need to use any of theAvailable Plugins, then you should include those too in yourapplication.js.coffee andapplication.css.scss.
# 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/help.min.js#= require plugins/image.min.js#= require plugins/image_manager.min.js#= require plugins/inline_class.min.js#= require plugins/inline_style.min.js#= require plugins/line_breaker.min.js#= require plugins/line_height.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/print.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/special_characters.min.js#= require plugins/url.min.js#= require plugins/video.min.js#= require third_party/embedly.min.js#= require third_party/font_awesome.min.js#= require third_party/image_tui.min.js#= require third_party/spell_checker.min.js
@import'plugins/char_counter.min.css';@import'plugins/code_view.min.css';@import'plugins/colors.min.css';@import'plugins/emoticons.min.css';@import'plugins/file.min.css';@import'plugins/fullscreen.min.css';@import'plugins/help.min.css';@import'plugins/image_manager.min.css';@import'plugins/image.min.css';@import'plugins/line_breaker.min.css';@import'plugins/quick_insert.min.css';@import'plugins/special_characters.min.css';@import'plugins/table.min.css';@import'plugins/video.min.css';@import'third_party/embedly.min.css';@import'third_party/image_tui.min.css';@import'third_party/spell_checker.min.css';
Similar, if you want to use language translation you have to include the translation file.
# Include Language if needed#= require languages/ro.js
Then restart your web server if it was previously running.
Details about initializing the editor can be found in theFroala WYSIWYG Editor official documentation.
Thewysiwyg-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 has3 different licenses.For details please seeLicense Agreement.
About
Ruby gem for Froala jQuery WYSIWYG HTML Rich Text Editor.