Integration of Redactor Rails in Active Admin

In our current app, there was a requirement to have a nice editor which will provide the basic functionalities like bold,italic and also image upload.
We decided to use redactor-rails gem Github-Documentation-Link(Github Doc) .

So i took following steps:

• In Gemfile i included:

gem 'redactor-rails'

• Then for image uploading and storing i included two more gems as:

gem 'carrierwave'
gem 'mini_magik'

• Bundle it.

rails generate redactor:install
rails generate redactor:config

• In application.js

//= require redactor-rails

• In active_admin.scss on the top include:

*= require redactor-rails

• In ActiveAdmin model i wrote:

f.input :name, input_html: {class: 'redactor'}

• In app/uploaders/redactor_rails_picture_uploader.rb set path for image store in store_dir method.
  Same for redactor_rails_document_uploader.rb

Now i am ready to use redactor editor.
But the editor was not properly fitted on my desktop so i found some css settings which i included in active_admin.css.scss

body.active_admin form.formtastic .redactor_box {
  margin-left: 20%;
  border: 1px solid #C9D0D6;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  width: 76%;
}

• While integrating redactor if there is any error while loading application on your browser '$ is undefined' then you add following:

In config/initializers/active_admin.rb include

config.register_javascript 'application.js'