> ## Documentation Index
> Fetch the complete documentation index at: https://docs.activeviam.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Configure the application menu

> How to customize the Atoti UI application menu by configuring leftApplicationMenu and rightApplicationMenu in the Configuration object, using built-in items such as applicationSubMenuHelp, applicationMenuItemAbout, and applicationMenuItemDocumentation.

The application menu runs across the top of the screen.

<Frame>
  <img
    src="https://mintcdn.com/activeviam/xdqxmncf8zYRCehD/data-visualization/atoti-ui/5.2/static/img/application-menu/application-menu.png?fit=max&auto=format&n=xdqxmncf8zYRCehD&q=85&s=4166a9401fa401ce1d44d9b861638d91"
    alt="Application menu bar showing File, Edit, and Insert on the left and Share,
Present, Help, and User on the
right"
    width="1485"
    height="158"
    data-path="data-visualization/atoti-ui/5.2/static/img/application-menu/application-menu.png"
  />
</Frame>

It is split into two sections:

1. The left section contains items that control the current [dashboard](../../../user-guide/create-a-dashboard/dashboards). By default, it contains a **File**, **Edit**, and **Insert** submenu.
2. The right section contains items that control the whole application. By default, it contains a [**Share**](../../../user-guide/create-a-dashboard/share-content) menu item, [**Present**](../../../user-guide/create-a-dashboard/dashboards#present-mode) toggle, and a **Help** and **User** submenu.

## Customize the application menu

You can customize the application menu by updating **leftApplicationMenu** and **rightApplicationMenu** in [configuration](../../reference/types#configuration) inside your **activate** function (see [setup](../../install-and-start/set-up)).

For example:

For a right application menu containing a single **Help** submenu with an **About** menu item, your `index.tsx` should look like this:

```typescript theme={"languages":{"custom":["/engine/python-sdk/0.9/languages/pycon.tmLanguage.json"]}}
import {
  Configuration,
  applicationMenuItemAbout,
  applicationSubMenuHelp,
} from "@activeviam/atoti-ui-sdk";

applicationSubMenuHelp.children = [applicationMenuItemAbout];

export default {
  activate: (configuration: Configuration) => {
    configuration.rightApplicationMenu = [applicationSubMenuHelp];
  },
};
```

For a right application menu with a **Documentation** menu item along with the same **Help** submenu as above, your `index.tsx` should look like this:

```typescript {4-4,13-13} theme={"languages":{"custom":["/engine/python-sdk/0.9/languages/pycon.tmLanguage.json"]}}
import {
  Configuration,
  applicationMenuItemAbout,
  applicationMenuItemDocumentation,
  applicationSubMenuHelp,
} from "@activeviam/atoti-ui-sdk";

applicationSubMenuHelp.children = [applicationMenuItemAbout];

export default {
  activate: (configuration: Configuration) => {
    configuration.rightApplicationMenu = [
      applicationMenuItemDocumentation,
      applicationSubMenuHelp,
    ];
  },
};
```