Share

Create Authentic Custom Navigation Images in Microsoft Dynamics CRM 2016

With the CRM 2015 spring online update (and 2016 online and on-premise) we were granted to the ability to customize the look and feel of CRM, including the much improved drawer-style navigation. As part of this update, the image style of the “area groupings” (e.g. Sales, Service, Marketing) was updated too. When adding custom areas, we used to be able to use a 32×32 image as the navigation icon and have it look pretty good. Unfortunately a regular 32px image doesn’t look very good at all…

One of these things is not like the other, one of these things just isn’t the same...
One of these things is not like the other, one of these things just isn’t the same…

I first noticed this with some demo/test images that I upgraded, but I couldn’t find anything specific in the SDK documentation about how to mimic this really slick visual style so I did a bit of digging. Here’s what I found:

  • Size is 85 pixels wide by 71 pixels high
  • The image is not centered, it’s about 80% of the total canvas size and anchored in the upper-right corner
  • The image is one color (white) on a transparent canvas
  • Not only is the color white, but its opacity has been set to 46
  • .PNG image
  • CRM does some resizing of the image when you interact with the menu

There’s a possibility this is buried in the SDK somewhere, but I’ve included my findings and how-to make your own good looking navigation images for use in your implementation.

I put together a short video (below) where I run through my process with a bit of narration.

 

I use paint.net (free download) but Photoshop or GIMP would both work just fine. As far as setting the image for a new menu, I use the SiteMap Editor in the XRM ToolBox.

Note, I want to be clear that entity icons are still 16×16 and 32×32. This only pertains to the images for the areas of a sitemap (Sales, Service, Marketing, Settings, [Custom]).

Free Guide
On-Premises vs. Cloud CRM

A guide to help you determine the best solutions for you.