Reference an image in Web Resource from Site Map or Ribbon

CRM 2011 has this excellent solution concept which I like it a lot!  If you can master on how to leverage solutions in CRM 2011, it’s quite powerful when you are doing customizations in CRM.  When doing Site Map or Ribbon customization, I often need to reference to an image. 

In the previous versions of CRM, I have to place the images into the ISV or the IMG folder under the CRM web site, and then reference to that image path.  CRM 2011 has totally changed, it’s trying to stay away from the ISV folder and everything now has to store in the Web Resource. 

So what is Web Resource?  You may just think of Web Resource as a folder within CRM that you can upload files to, it stores HTML pages, Silverlight Controls, Images, XML files and etc… If you would like to use them in CRM form, you can just insert them on to the form.  If you like to use them in Site Map or Ribbon, all you need to do is to use the $webresource: directive to specify a Web resource image to use as an icon in the ribbon or in the application navigation using Site Map. The following sample shows how to specify icons for a button in the ribbon.

 <Button Id="MyISV.opportunity.form.actions.FlyoutAnchor.Button.1"
 Image16by16="$webresource:new_/imgs/icon16.png"
 Image32by32="$webresource:new_/imgs/icon32.png"
/>

So if you want to reference an image in Web Resource from Site Map, follow the steps below:

 

  1. Upload the image to Web Resource.
  2. Export Site Map.
  3. Update Site Map and use $webresource: directive to specify a Web Resource image.
  4. Import Site Map.
  5. Publish All Customization.