Customizing the Office 2007 Ribbon UI - Part 3

  • Article

In this blog, I will walk through an example of adding a custom tab, custom group, and a button with a simple callback procedure to the Ribbon in a Word 2007 document. To get started:

1. Create the customization file in any text editor by adding the following XML markup to the file. Save the file as customUI.xml.
2. Add the following XML markup to the file:

<customUI xmlns="https://schemas.microsoft.com/office/2006/01/customui">
  <ribbon>
    <tabs>
      <tab id="CustomTab" label="My Tab">
        <group id="SampleGroup" label="Sample Group">
          <button id="Button" label="Insert Company Name" size="large" onAction="ThisDocument.InsertCompanyName" />
        </group >
      </tab>
    </tabs>
  </ribbon>
</customUI>

3. Create a folder on your desktop named customUI and copy the XML customization file to the folder.
4. Validate the XML markup with a custom UI schema.
Note:  This step is optional. For an example of tools you can use to validate XML markup, see the XSD Schema Validator on this Web site: https://apps.gotdotnet.com/xmltools/xsdvalidator.

5. Create a document in Word 2007 and save it with the name RibbonSample.docm.
6. Open the Visual Basic Editor and add the following procedure to the ThisDocument code module.

Sub InsertCompanyName(ByVal control As IRibbonControl)
   ' Inserts the specified text at the beginning of a range or selection.
   Dim MyText As String
   Dim MyRange As Object
   Set MyRange = ActiveDocument.Range
   MyText = "Microsoft Corporation"
   ' Range Example: Inserts text at the beginning
   ' of the active document
   MyRange.InsertBefore (MyText)
   ' Selection Example:
   'Selection.InsertBefore (MyText)
End Sub

7. Close and save the document.
8. Add a .zip extension to the document file name and double-click to open the file.
9. Add the customization file to the container by dragging the customUI folder from the desktop to the Zip file.
10. Extract the .rels file to your desktop. A _rels folder containing the .rels file is copied to your desktop.
11. Open the .rels file and add the following line between the last <Relationship> tag and the <Relationships> tag. This creates a relationship between the document file and the customization file:

<Relationship Id="someID" Type="https://schemas.microsoft.com/office/2006/relationships/ui/extensibility" Target="customUI/customUI.xml" />

12. Close and save the file.
13. Add the _rels folder back to the container file by dragging it from the desktop, overwriting the existing file.
14. Rename the document file to its original name by removing the .zip extension.
15. Open the document and notice that the Ribbon UI now displays the My Tab tab.
16. Click the tab and notice the Sample Group group with a button control.
17. Click the button and the company name is inserted into the document.

As you can see, adding your own customizations to the Ribbon UI is very easy. In the next blog, we'll look at adding additional controls and working with existing components.