Showing posts with label uni-form. Show all posts
Showing posts with label uni-form. Show all posts

Thursday, April 10, 2008

Design Free Administration Back Office For Rails Application

There are some common concerns to build a back office for a rails project. Not like the front pages, which are usually designed by professional web designers, back office pages often need to be scratched by programmers. It often takes me a lot of time to do the layout, HTML structures, header and footer, div content boxes, list table styles and form field styles. Though I am familiar with CSS, I still troubled a lot with the overall look and feel because of my lack of the web design gene. So I am writing here to conclude a way to be design fee....

1. Install my plugin uni_admin for admin layout, table styles:

http://code.google.com/p/ruby-on-rails-plugin-uni-admin/

2. Install uni-form and my uni-form-patch for form styles

http://code.google.com/p/rails-uni-form-patch/

3. Install plugin restful authentication for basic authentication

http://xiaoboonrails.blogspot.com/2008/02/install-and-config-rails-plugin.html

4. If you have installed comatose, it is easy to integrate comatose_admin with uni_admin layout
rake comatose:admin:customize
update related content of layouts/uni_admin_layout.html.erb to layouts/comatose_admin.rhtml

Rails Plugin Uni_Form_Patch for Plugin Uni-Form

UniFormPatch
============
A small patch plugin for Marcus Irven's uni-form plugin.

Code home: http://code.google.com/p/rails-uni-form-patch/

Fix the following features:
  • Make the form show properly
  • Show field focus and error background images
  • Show error and success form messages properly

Installation
=========
If you havn't installed uni-form, install it at first:
script/plugin install http://uni-form.rubyforge.org/svn/trunk/plugins/uni-form/

Follow the installation notes in Marcus's uni-form README to finish installation

Install uni_form_patch:
script/plugin install http://rails-uni-form-patch.googlecode.com/svn/trunk/uni_form_patch

The installation will automatically copy/update/delete files:
Copy public/images/uni-form/*.png
Update public/stylesheets/uni-form.css
Delete public/stylesheets/uni-form-generic.css

Example
=======
For the usage of uni-form, read Marcus's uni-form README.

Show uni-form style messages:
<% uni_form_for :user do |form| %>

<%= uniform_success_message flash[:notice] if flash[:notice] %>
<%= uniform_error_messages [@user] %>
<%= uniform_error_messages [@user, @address] %>

<% form.fieldset :type => "block", :legend => "cool stuff" do %>
<%= form.text_field :first_name, :required => true, :label => "Your first name" %>
<%= form.text_field :last_name %>
<% end %>
<%= form.submit "save" %>
<% end %>