Adding new items to ELMA left menu

In this article, we describe how to add a new items to ELMA left menu using a web module. 

Attention

Note, that using a visual editor you can configure existing toolbars (add or remove them) in the web application. Read more about it in ELMA Help.

It's necessary to add a new items to the left menu using web modules only if you develop your own extensions to ELMA.

 

To add a new item, you need to create a new web module and add a component that implements the IMenuItemsProvider extension point. You can learn more about creating web modules in this article.

For our module, the implementation of IMenuItemsProvider extension point is below:

 

[Component]
        public class MyMenuItemProvider : IMenuItemsProvider
        {
            public void Items (MenuItemFactory factory)
            {
                factory.Action<HomeController>(c => c.Index()).Order(100).Container("left");
            }

            public List<string> LocalizedItemsNames
            {
                get
                {
                    return null;
                }
            }

            public List<string> LocalizedItemsDescriptions
            {
                get
                {
                    return null;
                }
            }
        }

IMenuItemsProvider extension point contains 3 methods:

  • Items() – we use it to add a button to the left menu (using Container(“left”) parameter), specify the item’s index number and set a link to the Index action of Home Input parameter is of MenuItemFactory type – it is a standard menu builder in ELMA;
  • LocalizedItemsNames() and LocalizedItemsDescriptions() – these are obsolete methods and are not used any longer.

You also need to mark a controller’s method (in our case it is Index method) with the EleWise.ELMA.Web.Content.ContentItemAttribute attribute and specify the menu item’s name and path to icons:

[ContentItem(Name = "My menu item",
                    Image16 = RouteProvider.ImagesFolder + "unk16.png",
                    Image24 = RouteProvider.ImagesFolder + "unk24.png",
                    Image32 = RouteProvider.ImagesFolder + "unk32.png")]

As a result, we will see the following:

You can also check the module that we used for this article – it is attached to the article.

Attachments