---
title: Create command plugins for global toolbar
slug: cms-13/docs/create-command-plugins-for-global-toolbar
docTags: 
createdAt: 2026-07-30T20:22:09.640Z
---

Create a command plugin for the global toolbar in Optimizely Content Management System (CMS). Add a command provider to the global command registry, which maps command providers against keys.

## Create a command provider for the global toolbar

The following example creates a provider that adds three commands to the areas inside the global toolbar.

```javascript
//alloy/MyGlobalToolbarProvider
define([
    "dojo/_base/declare",
    "dijit/form/Button",
    "dijit/form/ToggleButton",

    "epi-cms/component/command/_GlobalToolbarCommandProvider",
    "alloy/TestCommand",
    "alloy/MyToggleCommand"
  ],
  function (declare, Button, ToggleButton, _GlobalToolbarCommandProvider, TestCommand, MyToggleCommand) {
    return declare([_GlobalToolbarCommandProvider], {
      constructor: function () {
        this.inherited(arguments);

        // The Global Toolbar has three areas that you can add commands to ["leading", "center", "trailing"]
        // the _GlobalToolbarCommandProvider extends the _CommandProviderMixin with helper methods for easy adding 
        // of commands to the different areas

        //Create dijit/Form/Button in the leading area and bind the TestCommand to it
        this.addToLeading(new TestCommand({
          label: "First command"
        }), {
          showLabel: true,
          widget: Button
        });

        //Create dijit/Form/ToggleButton in the center area and bind the TestCommand to it
        this.addToCenter(new MyToggleCommand({
          label: "Second command"
        }), {
          showLabel: true,
          widget: ToggleButton
        });

        //Create dijit/Form/Button in the trailing area and bind the TestCommand to it
        this.addToTrailing(new TestCommand({
          label: "Third command"
        }), {
          showLabel: true,
          widget: Button
        });
      }
    });
  }
);
```

The following code shows the test commands:

```javascript
//alloy/TestCommand.js
define([
		"dojo/_base/declare",
		"epi/shell/command/_Command"
	],
	function(declare, _Command) {
		return declare([_Command], {
			name: "Test",
			label: "Test command",
			tooltip: "Click to execute me",
			iconClass: "dijitIconNewPage", //Define your own icon css class here.
			canExecute: true,

			_execute: function() {
				alert("label : " + this.label);
			}
		});
	}
);

//alloy/MyToggleCommand.js
define([
		"dojo/_base/declare",
		"epi/shell/command/ToggleCommand"
	],
	function(declare, ToggleCommand) {
		return declare([ToggleCommand], {
			name: "Test",
			label: "Click here to toggle",
			tooltip: "Click to toggle me",
			iconClass: "dijitIconNewPage", //Define your own icon css class here.
			canExecute: true,

			_execute: function() {
				alert("Label : " + this.label);
			}
		});
	}
);
```

Register the command provider in the global command registry so that the system can find it:

```javascript
var commandregistry = dependency.resolve("epi.globalcommandregistry");
    
//The first parameter is the "area" that your provider should add commands to
//For the global toolbar the area is "epi.cms.globalToolbar"
//You need to register your custom global toolbar provider that we created before using that area
commandregistry.registerProvider("epi.cms.globalToolbar", new MyGlobalToolbarProvider());
```

To initialize a command provider, go to [Add a module initializer](docId:6n1GErNDmNb6oTl9BHvpJ). For an initializer example, go to [episerver / alloy-mvc-template](https://github.com/episerver/alloy-mvc-template/blob/doc/global-toolbar-provider/src/Alloy.Mvc.Template/ClientResources/Scripts/initializer.js).

A working example of these components is available on [Alloy MVC on GitHub](https://github.com/episerver/alloy-mvc-template/tree/doc/global-toolbar-provider/src/Alloy.Mvc.Template/ClientResources/Scripts). Clone the repository, check out the `doc/global-toolbar-provider` branch, and run the site. The commands display in the global toolbar.