Tuesday, 27 May 2014

Sharepoint- Using an Image From formatmap32x32.png in a Ribbon Control

As you know in SharePoint , ribbon button images are coming from a built in image called formatmap32x32.png and formatmap16x16.png which are located at:
C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\1033\IMAGES
So if you are creating custom ribbon buttons, and if you want to use one of the built in button image, then how would you set Image32by32Top and Image32by32Left ?
Here is the answer.
Get the image from from the above path. Choose the icon image which you would like yo use.
As shown below, say the icon which chose is a pie chart as marked with black outline.
Count its position from top. its 7. also count its position from left, its 8. 
Since the image is 32*32, you would calculate as left=32*8= 256 and Top=224.

Now in your Elements.xml use this counts as:
Image32by32="/_layouts/$Resources:core,Language;/images/formatmap32x32.png" Image32by32Top="-224" Image32by32Left="-256"
Use the similar steps for  formatmap16x16.png, only the difference is that multiply your count by 16, not 32.