Ribbon Designer

Applies to: Visual Studio Visual Studio for Mac

The Ribbon Designer is a visual design canvas. Use the Ribbon Designer to add custom tabs, groups, and controls to the ribbon of a Microsoft Office application.

Applies to: The information in this topic applies to document-level projects and VSTO Add-in projects for the following applications: Excel; InfoPath 2013 and InfoPath 2010; Outlook; PowerPoint; Project; Visio; Word. For more information, see Features available by Office application and project type.

To open the Ribbon Designer, add a Ribbon (Visual Designer) item to your project. You can then use the design tools for the following tasks:

• Design the Ribbon layout

• Handle events and set control properties

• Add controls to Backstage View

Add a Ribbon (Visual Designer) item to a project

To use the Ribbon Designer, add a new Ribbon (Visual Designer) item to your project. For more information, see How to: Get started customizing the ribbon.

When you add a new Ribbon (Visual Designer) item, Visual Studio automatically adds the following files to your project:

• A Ribbon code file. This file has the name that you specify for the Ribbon (Visual Designer) item in the Add New Item dialog box. Add code to handle Ribbon events to this file.

• A Ribbon Designer code file. This file contains code generated by the Ribbon Designer and should not be directly edited.

• A Resource file. This file contains the property values of each control on the ribbon.

  If you already have a Ribbon (Visual Designer) item from another project, you can reuse it in your current project by using the Add Existing Item dialog box.

Design a ribbon

There are three ways to open the Ribbon Designer:

• In Solution Explorer, double-click the Ribbon code file.

• In Solution Explorer, right-click the Ribbon code file, and then click View Designer.

• In Solution Explorer, select the Ribbon code file, and then click Designer on the View menu.

  The Ribbon Designer contains a default tab and group. You can remove the default tab and group from the Ribbon Designer. To remove the default group, right-click Group1, and then click Delete. To remove the default tab, right-click an empty area of the design surface, and then click Remove Ribbon Tab.

  You can also add custom tabs, groups, and controls to the Ribbon Designer. You can find these controls in the Toolbox, in the Office Ribbon Controls group. There are three ways to add controls from the Office Ribbon Controls group to the Ribbon Designer:

• Drag a control to an appropriate area on the Ribbon Designer.

• Click a control and then click an appropriate area in the Ribbon Designer.

• Select an appropriate area in the designer, and then double-click a control in the Toolbox.

Ribbon design workflow

Follow these basic steps to design the Ribbon layout:

1. Add a custom tab to the ribbon.

2. Add groups to the tab.

3. Add controls to the groups.

   Controls can be dropped only on groups; you cannot drag a control directly to a tab or to the ribbon. Groups can be dropped only on tabs; you cannot drag a group directly to a ribbon.

   Arrange controls by dragging them to the correct positions. You can set the properties of a control by using the Properties window.

   You cannot drag controls from one tab to another on the ribbon. If you want to move a control to another tab, you must use the Cut command to remove the control from one tab, and then paste the control on another tab. If you do cut the control and paste it, the event handler stops working. You can reconnect the event handler in the Properties window. For more information, see Properties window.

Add custom tabs to the ribbon

There are three ways to add a custom tab to the ribbon:

• Add a tab from the Toolbox.

• Right-click the Ribbon Designer, and then click Add Ribbon Tab.

• Open the Tab Collection Editor, and then click Add.

  To open the Tab Collection Editor, in the Properties window, select the Tabs property, and then click the ellipsis button .

  After you add a tab, you can add groups to contain controls.

Remove custom tabs from the ribbon

There are three ways to remove a custom tab from the ribbon:

• Right-click the designer, and then click Remove Ribbon Tab.

• In the Commands pane of the Properties window, click Remove Ribbon Tab.

• Open the Tab Collection Editor, select the tab, and then click Remove.

Change the position of a tab on the ribbon

You can change the order of custom tabs on a ribbon. You can also position custom tabs before or after a built-in tab on the ribbon. For more information, see How to: Change the position of a tab on the ribbon.

Customize built-in tabs on the ribbon

A built-in tab is a tab that is already on the ribbon of a Microsoft Office application. For example, the Data tab is a built-in tab in Excel.

You can add groups and controls to a built-in tab. By default, a custom group appears as the last group on a built-in tab, though you can move it before or after any built-in group on the tab.

You cannot remove built-in groups.

For details about how to customize a built-in tab, see How to: Customize a built-in tab.

Add groups to a tab

Groups logically organize controls on the ribbon. Add groups to tabs. Add all other controls to the group.

Add controls to groups

Add one or more controls to a group. The following table describes each control.

Handle events and setting properties

The Ribbon Designer enables you to set control properties at design time by using the Properties window. In addition, the ribbon exposes a strongly typed object model that you can use to get and set the properties of Ribbon controls at run time.

You can double-click any control on the designer to open an event handler for the control's default event. You can create event handlers for all other control events by using the Properties window.

Ribbon events and properties are located in the Microsoft.Office.Tools.Ribbon namespace. The Ribbon (Visual Designer) item automatically adds a reference to this assembly in the project and inserts the appropriate using or Imports statement at the top of the Ribbon code file.

For information about handling Ribbon events and setting the properties of Ribbon controls at run time, see Ribbon object model overview.

Customize Backstage view

You can use the Ribbon Designer to add controls to the menu that opens when you click the File tab. This menu is called the Backstage view.

You cannot position controls before or after built-in controls by using the Ribbon designer. A built-in control is a control that already appears in Backstage view. If you want to position controls before or after built-in controls, you must use Ribbon XML. For more information about Ribbon (XML), see Ribbon XML. For more information about customizing the Backstage view, see Introduction to the Office 2010 Backstage view for developers and Customize the Office 2010 Backstage view for developers.

Applies to: The information in this topic applies to document-level projects and VSTO Add-in projects for the following applications: Excel; InfoPath 2013 and InfoPath 2010; Outlook; PowerPoint; Project; Visio; Word. For more information, see Features available by Office application and project type.

For information about how to add controls to the Backstage view, see How to: Add controls to the Backstage view.

Accessibility in the Ribbon Designer

You can use keyboard shortcuts to move controls in the Ribbon Designer. Some keyboard shortcuts apply to all controls, and some apply only to controls that have menus.

The keyboard shortcuts that apply to all controls are shown in the following table.

The keyboard shortcuts that apply only to the Microsoft Office Menu, RibbonMenu, and RibbonSplitButton are shown in the following table.

See also

• Ribbon overview
• Ribbon XML
• Walkthrough: Create a custom tab by using the Ribbon Designer
• How to: Export a ribbon from the Ribbon Designer to Ribbon XML
• How to: Get started customizing the ribbon
• Access the ribbon at run time