Images on custom Ribbon controls
Ron de Bruin (last update 12-Sept-2008)
Go back to the Excel tips page
Intro

On this page I show you a few ways to display the image you want on a custom control on the Ribbon.
But before we start we first download the example workbooks and pictures.

Download the example workbooks and pictures
Create a new folder on your Desktop and unzip the files in this folder.

Note: If you are not familiar with the Custom UI Editor read the information on this page first.
http://www.rondebruin.nl/ribbon.htm



Use Built-in images

Open workbook Image1 to test the example below

I use the RibbonX below to add the custom button.
<button id="customButton1" label="Label 1" size="large" onAction="Macro1" imageMso="HappyFace" />

You see that I use imageMso="HappyFace" to tell Excel which image I want to see on the button.



There are 1871 built-in images that you can use in your RibbonX, but how do you find the image names?

Option 1: Jim Rech has done an add-in showing the Office 2007 button images.
According to Jim his add-in removes most or all duplicate images, adds some that the others
don't have and displays the images on actual buttons on the ribbon (by adding a new tab).
When you click a control its name is copied to the clipboard for pasting into RibbonX.
Download it from my site  File date (24-Jan-2008)

There is one small problem on this moment when you use this add-in that most people will never notice :
If you select “All Commands” In the “Choose commands from” dropdown in the QAT customize dialog
with this add-in loaded you will get a error 400 a lot of times, this is a bug in Excel 2007.



Option 2: Use John Walkenbach's mso image browser workbook.
Download it from my site

Option 3: Download this file from the Microsoft site Office 2007 : Icons Gallery





Use Custom images

Example 1Open workbook Image2 to test the example below

I add the picture ron.png into the Excel file with the "Insert Icons" option in the Custom UI Editor.



I use the RibbonX below to add the custom button.
<button id="customButton1" label="Label 1" size="large" onAction="Macro1" image="ron" />

You see that I use image="ron" to tell Excel which image I want to see on the button.



Example 2 : Open workbook Image3 to test the example below

In Example 1 the pictures are a part of the Excel file but we can also load pictures that are
in another location. In this example the pictures must be in the same location as the Excel file.
You see that the files Lightoff.png and Lighton.png that I use are in the same folder with example files.

I use the Ribbon attribute getImage with a VBA callback to display custom images on the buttons.
I also use the Ribbon attribute getLabel with a VBA callback to display labels on the buttons.

I use the RibbonX below to add the custom buttons.

<button id="customButton1" size="large" onAction="Macro1" getLabel="GetLabel" getImage="GetImage" />
<button id="customButton2" size="large" onAction="Macro2" getLabel="GetLabel" getImage="GetImage" />


See the GetImage and GetLabel callbacks in the VBA editor.





Change image with VBA after you open the file

In the three examples below I use a toggle button but you can use other controls also.
The image will change when the button is pressed or not pressed.
Note: Look good at the RibbonX and the VBA code in the files below.


Example 1 : Open workbook Image4 to test the example below

I use two built-in images in this example.
See the information in the first section of this page for finding the names of all 1871 built-in images.



Example 2 : Open workbook Image5 to test the example below

In Example 1 the pictures are a part of the Excel file but we can also load pictures that are
in another location. In this example the pictures must be in the same location as the Excel file.
You see that the files Lightoff.png and Lighton.png that I use are in the folder with example files.


Example 3 : Open workbook Image6 to test the example below.

In this example I use custom images that are in the Excel file.
I have add the pictures into the Excel file with the "Insert Icons" option in the Custom UI Editor.

It doesn't seem possible to use the Ribbon attribute getImage with a VBA callback to
display a custom image from the customUI\images folder in the Excel file on a Ribbon control.

But you can use the workaround in this example file.

Note: When you open the workbook it will automatic do the things below

1) It will first make a copy of the Excel file.
2) Then it changes the extension of the copy of the Excel file to .zip
3) Then it Unzips the files in this zip file into a normal folder
4) Then it uses the attribute getImage to load the pictures from that normal folder.
5) When you deactivate the workbook it will delete the temporary folder/file



More information

Change the Ribbon in Excel 2007
http://www.rondebruin.nl/ribbon.htm

There are more links in the "More Information" part of that page