Skip to content

Instantly share code, notes, and snippets.

@saiqulhaq
Created June 15, 2019 06:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save saiqulhaq/866aee315c480afa853f91f2677ee9b5 to your computer and use it in GitHub Desktop.
Save saiqulhaq/866aee315c480afa853f91f2677ee9b5 to your computer and use it in GitHub Desktop.
Active Admin Customization Guide

I’ve been worked on a project that used ActiveAdmin for few times, So I think I need to write it down what I’ve learn.
However actually this guide is for my self, to be my quick reference when I need to use ActiveAdmin again later

Best Theme/Skin

There are few ActiveAdmin themes/skins out there, I was impressed by screenshot/showcase on their homepage, but the problem is coming when I need to make customization, it lacks of documentation, or even not written yet. So far ActiveMaterial theme by Viget is the best one for me, it is based on Google Material Theme, well written and have good documentation. It has few components like Bootstrap do, you can check it out on Google Material Theme components docs. Maybe you will find that some Google Material Theme components is not exist on ActiveMaterial, but give a try to check ActiveMaterial source code, I found that they already write the components, but it hasn’t been written yet.

Custom Form

The only way to customizing the ActiveAdmin’s form is by create partial

ActiveAdmin.register User do
  form partial: ‘form’
end

Then create the needed file on the correct folder, which is /app/views/user/_form.html.erb . or you may execute the code, then it will raise an error and tells you where the location of _form.html.erb should be located.

Customizing Dashboard

There are two ways how to achieve it, if your design is simple, maybe using Arbre DSL is enough, and it advantage is you could get responsive design, example:

ActiveAdmin.register_page ‘Dashboard’ do
  content do
   columns do     
     column do        
       # Your content is here
     end
   end    
   # You may also create another columns    
   columns do
     column do
       # content
     end
     column do
       # content
     end
     column do
       # content
     end
   end
 end
end

The another way is by using partial

ActiveAdmin.register_page ‘Dashboard’ do
  content do
    render ‘dashboard’
  end
end

Very Useful Links

  1. Read the official documentation http://activeadmin.info
  2. Read the ActiveAdmin Content-Rendering API on https://github.com/activeadmin/activeadmin/wiki/Content-rendering-API
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment