Bootsy is a WYSIWYG solution for Rails based on Bootstrap-wysihtml5 which includes image uploads via CarrierWave.
- Ruby
2.0
or1.9.3
; - ImageMagick or GraphicsMagick (for MiniMagick);
- Rails
4.0
(you can get a temporary support for Rails3.2
on this branch); - Twitter Bootstrap properly added on your application.
- Add Bootsy to your Gemfile:
gem 'bootsy'
- Run the bundle command to install it:
bundle install
- Run the install generator:
rails g bootsy:install
- Add and run migrations (if you're using ActiveRecord):
rake bootsy:install:migrations
rake db:migrate
Just call the brand new method bootsy_area
in your FormBuilder
instances, the same way you'd call the basic textarea
method. Example:
<%= form_for(@post) do |f| %>
<%= f.label :title %><br />
<%= f.text_field :title %>
<%= f.label :content %><br />
<%= f.bootsy_area :content %>
<%= f.submit %>
<% end %>
Bootsy will group the uploaded images as galleries and associate them to one of your models. For example, if you have a Post
model and you want to use bootsy_area
with it, then you should include the Bootsy::Container
module:
class Post < ActiveRecord::Base
include Bootsy::Container
attr_accessible :content, :title
end
Don't forget to ensure the association of new instances of your model with Bootsy image galleries. For strong_parameters
, you must allow the parameter bootsy_image_gallery_id
in your controllers. Example:
private
# Never trust parameters from the scary internet, only allow the white list through.
def post_params
params.require(:post).permit(:title, :content, :bootsy_image_gallery_id)
end
It is possible to customize how the editor is displayed and its behavior by passing a hash editor_options
to your bootsy_area
.
You can enable/disable the buttons available on the editor. For example, if you want to disable the link and color buttons:
<%= f.bootsy_area :my_attribute, editor_options: {link: false, color: false} %>
Available options are: :font_styles
, :emphasis
, :lists
, :html
, :link
, :image
and :color
.
By default, Bootsy alerts for unsaved changes if the user attempts to unload the window. You can disable this behaviour by doing:
<%= f.bootsy_area :my_attribute, editor_options: {alert_unsaved: false} %>
It's also possible to use Bootsy without the image upload feature. Just call bootsy_area
in a form builder not associated to a Bootsy::Container
model. This way users can insert images in their texts by providing an image url.
You can set the default editor options, image sizes available (small, medium, large and/or its original), its dimensions and more. Take a look at the initalizer file, /config/initializers/bootsy.rb
.
Bootsy defines some i18n keys. The english translation is automatically added to your config/locales
directory as bootsy.en.yml
. You can follow that template in order to translate Bootsy to your language. You can find some examples here. It is also necessary to add a translation for Bootstrap-wysihtml5, the javascript editor, in your assets pipeline. Instructions here. If you are using the alert for unsaved changes, you have to define a translation for it as well. Just follow this example.
By default, Bootsy only supports ActiveRecord. In order to use Bootsy with Mongoid, please use Bootsy-Mongoid instead.
Do you want to use Bootsy alongside with SimpleForm? Take a look at Bootsy-SimpleForm.
MIT License. Copyright 2013 Volmer Soares