Skip to main content
Now that we’ve created a complete “Brand” model, let’s create an Admin Dashboard interface so our admins can manage the brands.

Step 1: Create the boilerplate Admin Dashboard UI

Admin Scaffold generator is a tool that helps us create a complete Admin Dashboard UI for our new resource. Run the following command in our Spree application root directory:
bin/rails g spree:admin:scaffold Spree::Brand
This will create the following files:
File TypePathDescription
Controllerapp/controllers/spree/admin/brands_controller.rbHandles the logic for the brands resource.
Viewapp/views/spree/admin/brands/index.html.erbDisplays the list of brands using the new tables system.
Viewapp/views/spree/admin/brands/new.html.erbDisplays the new brand form.
Viewapp/views/spree/admin/brands/edit.html.erbDisplays the edit brand form.
Partialapp/views/spree/admin/brands/_form.html.erbThe form partial used in new and edit views.
Initializerconfig/initializers/spree_admin_brands_table.rbRegisters the table with columns for the index view.
Initializerconfig/initializers/spree_admin_brands_navigation.rbAdds navigation to the admin sidebar.
It will also automatically add the following routes to your config/routes.rb file:
config/routes.rb
namespace :admin do
  resources :brands
end
You will now be able to access the brands resource at http://localhost:3000/admin/brands in your browser. To reference this route in your code, you can use the spree.admin_brands_path helper.

Step 2: Customize the Table Columns

The scaffold generator creates a table initializer at config/initializers/spree_admin_brands_table.rb with default columns:
config/initializers/spree_admin_brands_table.rb
Rails.application.config.after_initialize do
  Spree.admin.tables.register(:brands, model_class: Spree::Brand, search_param: :name_cont)

  Spree.admin.tables.brands.add :name,
    label: :name,
    type: :link,
    sortable: true,
    filterable: true,
    default: true,
    position: 10

  Spree.admin.tables.brands.add :created_at,
    label: :created_at,
    type: :datetime,
    sortable: true,
    filterable: true,
    default: true,
    position: 20

  Spree.admin.tables.brands.add :updated_at,
    label: :updated_at,
    type: :datetime,
    sortable: true,
    filterable: true,
    default: false,
    position: 30
end
You can customize this file to add more columns based on your model’s attributes. For example, to add a description column:
Spree.admin.tables.brands.add :description,
  label: :description,
  type: :string,
  sortable: false,
  filterable: true,
  default: true,
  position: 15
For complete table customization options including column types, filtering, sorting, and bulk actions, see the Admin Tables guide.

Step 3: Customize Navigation

The scaffold generator also creates a navigation initializer at config/initializers/spree_admin_brands_navigation.rb:
config/initializers/spree_admin_brands_navigation.rb
Rails.application.config.after_initialize do
  Spree.admin.navigation.sidebar.add :brands,
    label: :brands,
    url: :admin_brands_path,
    icon: 'list',
    position: 55,
    active: -> { controller_name == 'brands' },
    if: -> { can?(:manage, Spree::Brand) }
end
You can customize the icon and position to fit your needs. For example, to use the “award” icon and place it between Products (30) and Customers (40):
Spree.admin.navigation.sidebar.add :brands,
  label: :brands,
  url: :admin_brands_path,
  icon: 'award',
  position: 35,
  active: -> { controller_name == 'brands' },
  if: -> { can?(:manage, Spree::Brand) }

Adding to an Existing Submenu

To add “Brands” to the Products submenu instead, use the parent option:
config/initializers/spree_admin_brands_navigation.rb
Rails.application.config.after_initialize do
  Spree.admin.navigation.sidebar.add :brands,
    label: :brands,
    url: :admin_brands_path,
    position: 50,
    parent: :products,
    active: -> { controller_name == 'brands' },
    if: -> { can?(:manage, Spree::Brand) }
end
After restarting your server, you’ll see the new “Brands” navigation link in the admin sidebar!
For complete navigation API documentation including all available options, submenu creation, badges, and more, see the Admin Navigation guide.