Dev GuideAPI ReferenceUser Guide
HomeDev GuideAPI Reference
Dev GuideAPI ReferenceUser GuideLegal TermsGitHubNuGetDev CommunityOptimizely AcademySubmit a ticketLog In
Dev Guide
Legal TermsGitHubNuGetDev CommunityOptimizely AcademySubmit a ticket

Customize the left menu

Describes how to customize the left menu navigation in Commerce Manager in Optimizely Commerce Connect 13.

Suggest Edits

📘

Note

This content does not apply to Commerce Connect versions 14+.

Any application may extend the left menu navigation. You also can add, delete, or change an existing tab by creating the LeftMenu.xml file.

Link to an existing tab

The following image and code sample show how to add a link (Countries) to an existing tab in left menu.

200 
<?xml version="1.0" encoding="utf-8" ?>
    <View xmlns="http://schemas.mediachase.com/ecf/view">
      <Navigation>
        <Tabs id="mainTag">
          <Tab id="navTabAdmin" create="true">
            <Link id="Core_System">
              <Link id="Core_Dictionaries">
                <add>
                  <Link id="Core_CountriesDictionary" 
                        text="\{SharedStrings:Countries\}" 
                        order="20" 
                        iconUrl="" 
                        iconCss="" 
                        command="cmdOrderCountriesDictionary"
                        permissions="order:admin:meta:fld:mng:view"/>
                </add>
              </Link>
            </Link>
          </Tab>
        </Tabs>
      </Navigation>
    </View>

Add a tab to the left menu

The following example shows how to add an empty tab within Order Management.

<?xml version="1.0" encoding="utf-8" ?>
    <View xmlns="http://schemas.mediachase.com/ecf/view">
      <Navigation>
        <Tabs id="mainTag">
          <add>
            <Tab id="navTabOrderManagement" 
                 text="{OrderStrings:Order_Management}" 
                 order="80" 
                 contentType="default" 
                 imageUrl="~/Apps/Order/images/module.png" 
                 configUrl=""
                 enableHandler="Mediachase.Commerce.Manager.Apps.Order.CommandHandlers.OrderTabEnableHandler, Mediachase.ConsoleManager" 
                 permissions="order:mng:view">
            </Tab>
          </add>
        </Tabs>
      </Navigation>
    </View>

Remove tabs

The following example shows how to remove a tab within Order Management.

<?xml version="1.0" encoding="utf-8" ?>
    <View xmlns="http://schemas.mediachase.com/ecf/view">
      <Navigation>
        <Tabs id="mainTag">
          <remove nodeId="navTabOrderManagement">
        </Tabs>
      </Navigation>
    </View>

Modify a link in a tab

The following example shows how to remove the Core_CountriesDictionary link from the Order Management tab.

<?xml version="1.0" encoding="utf-8" ?>
    <View xmlns="http://schemas.mediachase.com/ecf/view">
      <Navigation>
        <Tabs id="mainTag">
          <Tab id="navTabAdmin" create="true">
            <Link id="Core_System">
              <remove nodeId="Core_CountriesDictionary" />
                <add>
                  <Link id="Core_CountriesDictionary" 
                        text="Modified Link" 
                        order="20" iconUrl="" 
                        iconCss="" 
                        command="cmdOrderCountriesDictionary"
                        permissions="order:admin:meta:fld:mng:view"/>
                </add>
              </Link> 
            </Link>
          </Tab>
        </Tabs>
      </Navigation>
    </View>

XML description

The Tab element can contain the following attributes:

  • id (text) – Unique identifier within xml file.
  • text (text) – Text displayed by the tab. Can contain a resource string with the following format: {ResourceName:ResourceKey}.
  • order (int) – Weight, which determines the location of the tab.
  • imageUrl (text) – Relative image path for the tab.
  • enableHandler (text) – Fully qualified class name for the tab EnableHandler (if EnableHandler returns false, the tab is not displayed in the left menu). The class must implement the ICommandEnableHandler interface.
  • permissions (text) – Parameter passed as a CommandParameter value to the EnableHandler.

The following example shows how to retrieve permissions in the EnableHandler class:

public bool IsEnable(object sender, object element)
      {
        var commandParams = element as CommandParameters; 
        if (commandParams != null)
          {
            string permissions = commandParams.CommandArguments["permissions"];
          }
      }

The Link element can contain the following attributes:

  • id (text) – Unique identifier within XML file.
  • text (text) – displayed by the element. It can contain a resource string with the following format: {ResourceName:ResourceKey}.
  • order (int) –, which determines the location of the element.
  • imageUrl (text) – Relative image path for the element.
  • enableHandler (text) – Fully qualified class name for the element EnableHandler (if EnableHandler returns false, the element is not displayed in the left menu). The class must implement the ICommandEnableHandler interface.
  • iconCss (text) – Css class for the menu image.

Updated 2 months ago