Search code examples
extjspimcore

Pimcore - How to add custom button to object tree menu


I would like to add a custom menu button to the object tree context menu of Pimcore 4.3.1, for example before the copy button:

Object tree context menu

I think the best solution would be a custom plugin: https://www.pimcore.org/docs/latest/Extending_Pimcore/Plugin_Developers_Guide/Plugin_Backend_UI.html

In the 'pimcoreReady' function of the plugin I am able to extend for example the main navigation and adding custom buttons... But I can't find anything about extending the object tree...

I already looked at /pimcore/static/js/pimcore/object/tree.js where the original menu is created, but can'f find anything useful.


Solution

  • The approach using a custom plugin will work. The docs you mentioned, https://www.pimcore.org/docs/latest/Extending_Pimcore/Plugin_Developers_Guide/Plugin_Backend_UI.html, shows a list of available javascript events.

    The prepare*TreeContextMenu events are specifically ment to modify the context menu in the tree panels. You can execute a function for this event by simply adding it to you plugin class in the same way you did with the pimcoreReady event, like so:

    pimcore.plugin.myplugin = Class.create(pimcore.plugin.admin, {
        prepareObjectTreeContextMenu: function (menu, treeClass, object) {
    
            // Modify ext menu
            menu.add({
                text: "My Button",
                iconCls: "pimcore_icon_copy",
                handler: function () {
                    console.log('Clicked menu button');
                }
            });
        }
    }