Adding custom Ribbon menu in MS Office using C#

- Mohankumar Devasigamani

Hope readers might have gone through my previous post which helps you to better understand on how to create MS Office add-ins.

    Note: As per my previous blog post, I sticked on MS Visual Studio 2010 & MS Office 2010.

Creating the add-in project
Click here to refer my pervious blog post.

Adding Reference to the project

• Open MS Office add-in project (CSSSampleAddin)
• Right-click on Reference folder in add-in project ->Go to Add Reference
• Add Reference window will appear.

         Click COM tab. Select Microsoft Office 14.0 Object Library, Microsoft Office Core and then click OK

Creating the Ribbon menu Customization XML File

• Right-click on project -> Add -> New Item
• Select XML file and name it as RibbonMenu.xml ->Click Add
• Edit and add the below XML content to the XML file.

<?xml version="1.0" encoding="utf-8" ?>

<customUI xmlns=http://schemas.microsoft.com/office/2006/01/customui           loadImage="GetImage">

<ribbon>

  <tabs>

   <tab id="tab1" label="CSS Corp Demo">

    <group id="group1" label="CSS Group">

     <menu id="menu1" label="Drop Down" itemSize="large" 

               getScreentip="GetScreenTip" supertip="This is a super tip   

               for the menu." image="star">

      <button id="uxSearchButton" image="search"   

      getDescription="GetDescription"

       </menu>

   </group>

  </tab>

</tabs>

</ribbon>

</customUI>

• Save the file.

Set the RibbonMenu.xml as embedded resource

• Right-click on the RibbonMenu.xml file -> Properties
• Change Build Action property to Embedded Resource
• Go to CSSSampleAddin project properties -> Select Resource tab
• Select file option, and drag and drop the xml file -> Save the properties

Start writing the code

Open Connect.cs and add below lines in top of the class file

using Microsoft.Office.Core;

using Word = Microsoft.Office.Interop.Word;

Create instance of Word and implement the IRibbonExtensibility interface. Edit / Modify the existing code as below

private Word.Application applicationObject;

Edit /Modify the first line of OnConnection() method as below

applicationObject = (Word.Application)application;

Inherited the IRibbonExtensibility in Connect class

public class Connect : Object, Extensibility.IDTExtensibility2, IRibbonExtensibility

Right-click on implemented interface and click Implement Interface, and then click Implement Interface Explicitly that will add IRibbonExtensibility.GetCustomUI method. Add the below line GetCustimUI method.

return Properties.Resources.Ribbon;

Now almost your demo add-in is ready for test. Before testing add the image for custom ribbon menu.

Adding your own image file

• Right-click on project -> Add -> New Item
• Select Bitmap file ->Browse your image -> Click Add
• To embed the image, please follow the same steps that we did for XML file.

For example here i have added two images named search and star. You can see those two images below .

Add the below method in connect class

public IPictureDisp GetImage(string imageName)

{

 IPictureDisp dispImage = null;

 switch (imageName)

 {

  case "search":

  dispImage = PictureConverter.ImageToPictureDisp

              (Properties.Resources.search);

  break;

  case "star":

  dispImage = PictureConverter.ImageToPictureDisp

              (Properties.Resources.star);

  break;

 }

return dispImage;

}

Include the below class in the same file.

internal class PictureConverter : AxHost

{

 private PictureConverter() : base(String.Empty) { }

 static public IPictureDisp ImageToPictureDisp(Image image)

 {

    return (IPictureDisp)GetIPictureDispFromPicture(image);

 }

 static public IPictureDisp IconToPictureDisp(Icon icon)

 {

   return ImageToPictureDisp(icon.ToBitmap());

 }

 static public Image PictureDispToImage(IPictureDisp picture)

 {

   return GetPictureFromIPicture(picture);

 }

}

GetImage method will be already referred from RibbonMenu.xml file.

          Right time to test demo project. Build the CSSSampleAddin project. Go to project properties  Select Debug and set Start external program to Word, 

by default word exe located in C:\Program Files\Microsoft Office\Office14\WINWORD.EXE

Run the add-in project, you will be able to see the customized Ribbon menu.

Write the method to handle click event of Search button.

public void Search(Microsoft.Office.Core.IRibbonControl control)

{

MessageBox.Show("User has clicked Search button.", "CSS Corp Demo");

}

I hope this post helped you to know how ribbon menu can be added to Microsoft Word. Similarly the same process can be used to add ribbon menu to any of the Microsoft Word Office tools (Excel,Access etc.) As I mentioned in my previous blog. In Further you can setup project to create msi /exe which will help you to create add-in in other machine.

Note: Await and stay tuned for my next post "List to be checked out while MS Office add-ins are not getting loaded".