2 minutes admin layout with rails and the web-app-theme generator
July 30th, 2009
Many people found out a rails generator inside my web-app-theme project and asked me how to use it.
Here an example, starting from scratch with a new rails app that manages music Albums.
rails cool_albums cd cool_albums script/generate scaffold Album name:string artist:string date:date rake db:migrate
After creating the first controller with a scaffold or with your hands, start creating a theme:
script/plugin install git://github.com/pilu/web-app-theme.git script/generate theme application --app_name="My Cool Albums" --theme="drastic-dark"
The first argument (“application”) is the name of the layout that the generator will create (application.html.erb).
The –app_name option specifies the name used as page title, and with the –theme specifies which theme to use among all the available themes inside the plugin.
Now remove the default index.html created by rails and the layout created by the scaffold:
rm app/views/layouts/albums.html.erb rm public/index.html
Add the following line in your routes.rb to set the default page of the application:
map.root :controller => :albumsStart the server
script/server
Ok, the layout has been successfully created, but we need to apply a theme for each one of the views generated by the scaffold.
script/generate themed albums album --layout=application --with_will_paginate
With the first 2 arguments I specified the controller path (albums) and the model used (album).
The –layout options is used by the themed generator to know where to add the Albums menu link.
Since we want to use will paginate (we set the –with_will_paginate option), we need to change one line in our albums controller from:
@albums = Album.all
to:
@albums = Album.paginate(:per_page => 10, :page => params[:page])
Here a trick to show form error messages inside the auto generated forms, you can add the following lines in your environment.rb:
ActionView::Base.field_error_proc = Proc.new do |html_tag, instance| if html_tag =~ /<label/ %|<div class="fieldWithErrors">#{html_tag} <span class="error">#{[instance.error_message].join(', ')}</span></div>| else html_tag end end
Ok, restart your server and you are done.
Feel free to fork the project from github to improve the generator or to add a new theme.
5:54 pm on July 30th, 2009:
Great tutorial, thank you very much, interesting plugin.
8:00 pm on July 30th, 2009:
[...] GravityBlast – by Andrea Franz » 2 minutes admin layout with rails and the web-app-theme generatorgravityblast.com [...]
8:01 pm on July 31st, 2009:
[...] GravityBlast – by Andrea Franz » 2 minutes admin layout with rails and the web-app-theme gene… [...]
4:22 pm on August 1st, 2009:
Grazie Andrea!:-)
5:12 pm on August 1st, 2009:
Great Work! Thanks a ton!
1:54 am on August 2nd, 2009:
Anyone have a dynamic ‘theme-picker’ for this? It would be sweet to be able to move from one to another without having to edit files.
Very nice tutorial – thanks!
11:48 pm on August 15th, 2009:
Thanks but I keep getting a 500 internal server error when I start the server.
I´m using easy-rails with Ruby 1.8.7 and Rails 2.3.2 in Windows.
12:57 am on August 16th, 2009:
Do you have any errors on the console?
10:32 pm on August 16th, 2009:
Thanks for the fast reply!
Here’s the console:
C:\easy-rails\rails_apps\cool_albums>ruby script/server
=> Booting Mongrel
=> Rails 2.3.2 application starting on http://0.0.0.0:3000
=> Call with -d to detach
=> Ctrl-C to shutdown server
Processing ApplicationController#index (for 127.0.0.1 at 2009-08-16 18:28:09) [G
ET]
NoMethodError (undefined method `camelize’ for :albums:Symbol):
/!\ FAILSAFE /!\ Sun Aug 16 18:28:09 -0400 2009
Status: 500 Internal Server Error
ActionView::TemplateError (undefined method `humanize’ for :albums:Symbol) in C:
/easy-rails/ruby/lib/ruby/gems/1.8/gems/actionpack-2.3.2/lib/action_controller/t
emplates/rescues/diagnostics.erb:
In c:/easy-rails/ruby/lib/ruby/gems/1.8/gems/actionpack-2.3.2/lib/action_con
troller/templates/rescues/diagnostics.erb
2:29 pm on August 21st, 2009:
Really nice post!
This is gold!
The thing is if I want to split admin view such as
/admin/album
I’m getting some issue. The doc is a little bit tricky
Did you try this?
11:34 am on August 25th, 2009:
@Carlos I didn’t try it with ruby 1.8.7 and windows, I’ll try soon..if you find something feel free to send me a patch.
@Benoit it should work with “script/generate themed admin/posts post”. Did you try it?
11:08 pm on August 25th, 2009:
[...] for 2009-08-25 GravityBlast – by Andrea Franz » 2 minutes admin layout with rails and the web-app-theme generator (tags: rails ruby ui theme) Spread the [...]
8:01 am on September 3rd, 2009:
Props. Love the plugin. Just about saved me 5 hours of work this morning. Smashing!
1:23 am on September 8th, 2009:
[...] http://gravityblast.com/2009/07/30/2-minutes-admin-layout-with-rails-and-the-web-app-theme-generator... [...]
6:30 pm on September 27th, 2009:
[...] Source:GravityBlast – by Andrea Franz » 2 minutes admin layout with rails and the web-app-theme gene… [...]
3:42 pm on October 3rd, 2009:
Looks amazing, I tried today. Keep it up good work.
3:37 am on October 29th, 2009:
Finally got around to trying this out… swanky. Just wish it supported Haml/Sass!
8:38 am on October 29th, 2009:
It doesn’t support haml but I want to add that feature soon!
4:56 am on November 5th, 2009:
Andrea,
this looks cool. I’m new to Ruby on Rails development. What pagination gem do you recommend. I followed your two minute admin example and I get:
“NoMethodError (undefined method `paginate’ for #):”
thanks
Paul
8:40 am on November 5th, 2009:
Paul, you need to install will_paginate
10:18 pm on January 14th, 2010:
Hey Hi, great work you have done there…
I have some issues… I have two models: tickets and projects. I can access tickets through a project’s url like this: /project/1/tickets.
Is there any in which when I generate the theme for a project it automatically creates sort of a link that lists all the tickets a project has? Or a way to not lose visibility of projects when generating the views for tickets?
Any help would be much appreciated.
Miguel
11:26 pm on January 14th, 2010:
Unfortunately there isn’t a way to do it automatically..I usually generate the default theme and then I modify links as I want
3:48 pm on January 15th, 2010:
Ok,
Actually I was doing it that way.
Would be a nice feature for a future release
Thanks for you answer…
Miguel