CODEWITHSUNDEEP
ruby-on-railsactiveadmin
monteirobrena
monteirobrena

Reputation: 2620

Is there anyway to add another levels of menus with Active Admin?

I'm using Active Admin and trying add another levels at drop down menu. In documentation I see that I can put one level using this code:

  ActiveAdmin.register Post do
    menu :parent => "Blog"
  end

Thanks for any help.

Edited:

I want something like that:

Menu 1 ^
Menu 2 > Menu A
         Menu B
Menu 3

Upvotes: 4

Views: 4792

Answers (3)

Michael Wiltbank
Michael Wiltbank

Reputation: 141

You can accomplish this in ActiveAdmin.setup config file with a little css help.

First in ActiveAdmin.setup add:

config.namespace :admin do |admin|
  admin.build_menu do |menu|
    menu.add id: 'submenu-id', label: proc { 'SubMenu Title' }, parent: 'Blog', if: proc { current_user.superadmin? } do |submenu_item|
      submenu_item.add label: 'Menu A', url: '/admin/menu_a'
      submenu_item.add label: 'Menu B', url: '/admin/menu_b'
      submenu_item.add label: 'Menu C', url: '/admin/menu_c'
    end
  end
end

Then add a little css to active_admin.css.scss to adjust your view. Something like this:

#submenu-id {
  ul {
    display: none !important;
    position: absolute !important;
    left: 166px;
    margin-top: -30px !important;
  }

  &:hover ul {
    display: block !important;
  }
}

I'm sure you will slightly need to adjust your css as appropriate. You will all so need to add 'menu false' to each ActiveAdmin.register page.

Upvotes: 1

monteirobrena
monteirobrena

Reputation: 2620

I got fix this problem overwriting the menu of ActiveAdmin. It was also necessary create a new CSS to the new menu.

Inform the ActiveAdmin that we will use a header itself. To this add the following lines in the file config/initializers/active_admin.rb:

config.view_factory.header = CustomAdminHeader
config.register_stylesheet 'new_menu.css'

Create a class called CustomAdminHeader that will contain the code that will overwrite the construction menu. You can create this class within the app/admin and name the file as custom_admin_header.rb. And add this code to create the new menu:

class CustomAdminHeader < ActiveAdmin::Views::Header
  include Rails.application.routes.url_helpers

  def build(namespace, menu)
    div :id => 'tabs' do
      # Add one item without son.
      ul do
        # Replace route_destination_path for the route you want to follow when you receive the item click.
        li { link_to 'Item without son', route_destination_path }
      end

      # Add one item with one son.
      ul do
        li do
          text_node link_to("Parent with 1 child", "#")
          ul do
            li { link_to 'Son without child', route_destination_path }
            # If you want to add more children, including more LIs here.
          end
        end
      end

      # Adds a menu item with one son and one grandson.
      ul do
        li do
          text_node link_to("Grandmother with 1 child", "#")
          ul do
            li do
              text_node link_to("Parent with 1 child", route_destination_path)
              ul do
                li { link_to 'Grandson without child', route_destination_path }
                # If you want to add more grandchildren, including more LIs here.
              end
            end
          end
        end
      end

    super(namespace, menu)
  end
end

The structure of your menu will be created by this class so the menu settings used in the classes contained in the folder app/admin should not be displayed. For this you need to add the following code in all classes:

menu false

Finally you need to create a CSS file called new_menu.css and add the CSS for the new menu.

I posted this solution at my blog:

http://monteirobrena.wordpress.com/2013/05/07/activeadmin-customizacao-do-menu/

I hope it's helpful for anyone.

Upvotes: 5

rocket scientist
rocket scientist

Reputation: 2447

If you put multiple resources under the same parent in the menu then your drop down will have a level for each of those resources. For the below example, the Blog tab will drop down a menu with Posts and Comments in it. All you have to do to add more resources to the "Blog" drop down is make their menu :parent => "Blog"

Post Resource

ActiveAdmin.register Post do
  menu :parent => "Blog"
end

Comment Resource

ActiveAdmin.register Comment do
  menu :parent => "Blog"
end

Upvotes: 4

Related Questions