I have seen people asking on how to go about changing the Dynamics CRM 2013 logo and have their own custom one in place. So I decided to make an article about it. But before I proceed, let me state a disclaimer by saying that this is UNSUPPORTED and is completely at your own risk. I would also like to add that this works for ON-PREMISE version only since you’d need to do some changes in the files.
How to change CRM 2013 Logo
Dynamics CRM 2013 has a completely different DOM than it’s predecessor CRM 2011. The first thing that strikes is how the elements appear on the page in an asynchronous manner, floating its way from the right. Other than that, there has been a few more changes. The text “Microsoft Dynamics CRM” that you see in the far left is not actually an image but a text! The Dynamics CRM logo is however an image.
Okay, now let’s get into the technical part to see what needs to be changed where for the entire thing to work. We would need to replace the whole Dynamics CRM logo by changing two things:
- Dynamics CRM image
- The text “Microsoft Dynamics CRM”
Changing the Dynamics CRM image
First, we will change the CRM image with our own. You can do that in two ways, the simpler one being directly going and replacing the logo images with your own.
- Replacing the CRM Logo Approach:
To to that, navigate to “C:\Program Files\Microsoft Dynamics CRM\CRMWeb\_imgs\Navbar” (replace C with your drive name where Dynamics CRM is installed). Locate the files “NavBarLogo.png” and “NavBarLogo_blue.png” and replace them with your own. That’s all for this approach.
- Using your own Logo Approach:
For this approach, copy paste your logo files inside “C:\Program Files\Microsoft Dynamics CRM\CRMWeb\_imgs\Navbar” folder. Now navigate to “C:\Program Files\Microsoft Dynamics CRM\CRMWeb\_controls\navbar”.
Open up the “navbar.css.aspx” file in your favorite editor and locate the lines the following CSS snippet:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
#navTabLogoImage { background-image:url("/_imgs/NavBar/NavBarLogo.png"); background-repeat: no-repeat; width: 18px; height: 16px; vertical-align: middle; } .navTabButton.selected #navTabLogoImage, .navTabButton:hover #navTabLogoImage { background-image:url("/_imgs/NavBar/NavBarLogo_blue.png"); background-repeat: no-repeat; width: 18px; height: 16px; vertical-align: middle; } |
Change the “background-image:” property to your file names. For example, if your logo file names are “myCustomLogo.png” and “myCustomLogo_blue.png”, the modified CSS would look like the following
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
#navTabLogoImage { background-image:url("/_imgs/NavBar/myCustomLogo.png"); background-repeat: no-repeat; width: 18px; height: 16px; vertical-align: middle; } .navTabButton.selected #navTabLogoImage, .navTabButton:hover #navTabLogoImage { background-image:url("/_imgs/NavBar/myCustomLogo_blue.png"); background-repeat: no-repeat; width: 18px; height: 16px; vertical-align: middle; } |
Changing the “Microsoft Dynamics CRM” text
Now to change the text. Navigate to “C:\Program Files\Microsoft Dynamics CRM\CRMWeb\_static\_controls\NavBar” and locate the only file “NavBar.js”. Open it up in your favorite editor. There is going to be a lot of stuff in there. So, just search for the text “Microsoft Dynamics CRM”.
Replace “Microsoft Dynamics CRM” with your Company name, or whatever you wish to be displayed there. There will be two “Microsoft Dynamics CRM” texts. Replace both of them.
Save it, and exit. If you’ve followed the above steps correctly, after a hard refresh (Ctrl + F5) and probably an IISRESET, you should be able to see your new logo in place of the default one.
I would like to thank Jeremie for his solution on the CRM text part. I had initially described another solution which was not so good, so thanks to him for sharing the easier, more relevant one!
Modifying the On Hover “Microsoft Dynamics CRM” tool-tip
Even after you’ve changed the text, you’ll see that on hovering over the new logo and text, the word “Microsoft Dynamics CRM would come up in the tool-tip. Now how do you go about changing that? I did some more digging, thanks to Limmy (in the comments below) who provoked me to find a way for this. 🙂 And I found, it’s pretty simple, although internally it would be breaking some Microsoft code. 😛
Have that same NavBar.js file open, and locate this thingy (title=”{2}”) as shown below. This should be a couple of lines before the “Microsoft Dynamics CRM” text that you just changed in the earlier section.
Change it to whatever text you wish to appear as the tool-tip. Remember, similar to how you changed the “Microsoft Dynamics CRM” text twice for the logo text to change, make the changes for the title=”{2}” in two places as well. So, after change the source file would look like the following.
You should then have the results! Ta-da!
What we just did here was prevent Microsoft from appending the tool-tip at run-time. They had a placeholder (denoted by {2}) in the static file to be changed at run-time to a text of their choice, which happens to be “Microsoft Dynamics CRM”. We just prevented that by replacing the placeholder with a static text of our choice. So, during run-time there would be no replacement. 🙂
Please leave comments if it worked for you and in case you manage to find a better solution, please let me know. 🙂
the text for the element ‘navtablogotext’ is found in the file ..\Microsoft Dynamics CRM\CRMWeb\_static\_controls\NavBar\
you could replace ‘Microsoft Dynamics CRM’ with your preferred text there. Still unsupported but you asked if anyone knew where to find it…
Jeremie
Hi Jeremie,
Thank you for your solution. That’s much easier and relevant. I have updated the blog with your method. And definitely you deserve credits for that!
Cheers!
Hi Dynamotion,
Thanks for the guide, I have just one question, I have Dynamic Crm 2013 for Web rather than on premises, so was wondering how i would go about doing the change of logo since i dont have the files on my PC
Hi CRM4Life,
Unfortunately, for CRM 2013 Online I am not aware of anything that can help you change the logo.
This solution requires modifying the core CRM files (which we are not supposed to touch since it’s not supported), which is why this solution works only for the On-Premise where we can play with these files.
However, if I come up with anything that works for CRM 2013, I’ll shoot you an email!
Many thanks for this! Although this is unsupported, this gets the job done and our customer is happy.
Cheers,
Clarence
Hi Dynamotion,
I have multiple organizations set up for our CRM 2013 server deployment. By changing the files as you suggested, would all organizations inherit the same logo throughout?
Is there a way to insert company logo to a specific CRM organization rather than all?
Cheers also,
Limmy
Hi Limmy,
Since this customization involves changing the core files of Dynamics CRM, performing this will have effect on all Organizations for a particular Dynamics CRM server. All the Organizations of a particular Dynamics CRM server use the same core files (aspx, js, css).
Unfortunately there isn’t a way to modify the logo only for a specific CRM Organization.
However, if I come up with something helpful, I’ll shoot you an email.
Thanks!
Hi Dynamotion,
Thanks for your response. Much appreciated. So i decided to make changes to our development CRM server according to your guide and i must say it did work very well. I was able to customise the header colour too.
But one thing i did find hard to customize is the Tooltip. Would you know how to update the tooltip text against the new company logo? If you were to hover your mouse over the new logo, would it still show as “Microsoft Dynamics CRM” ?
I look forward to your reply.
Regards,
Limmy
Hi Limmy,
You asked for it and you got it!
Check the article update above and you should be able to change the tool-tip to a text of your choice.
I believe we have broken enough Microsoft code. 😛
Cheers,
Dynamotion
Dear Dynamotion,
Wow, it did work like a charm. Thanks for putting so much effort in hacking through CRM 2013. It is indeed a great learning curve.
In regards to your last comment in the added section, “make the changes for the title=”{2}” in two places as well”.
I found out that the NavBar.js file which I am working on has an extra 5 more [title=”{2}”] values apart from the 2 which i have updated successfully.
Can you kindly comment on this?
Thanks again. 🙂
Regards,
Limmy
Hi Limmy,
Glad to hear it worked great for you!
The other [title=”{2}”]s correspond to other elements which have their values set during run time. Our objective here is to change only the two which are associated with the text “Microsoft Dynamics CRM”. The others can be left as is as we wouldn’t want to break anything else.
The easiest way to find the two that require change is search by the word “Microsoft Dynamics CRM” or (if you have already replaced that with a custom name) the replaced custom name, and look for the [title=”{2}”] nearby (2-3 lines up based on the editor you’re using) and replace them. This will ensure we only block the run time replacement of the logo hover text and keep everything else intact.
Hope this answers your question. 🙂
Cheers,
Dynamotion
This is really helpful, thanks for this blog.
Hello
Thanks for this tutorial Dynamotion .
I tried to apply this to Crm 2015 on Premise ( Update 0.1) .
I found out that the Images and the tooltip can be changed as you describe . This worked perfect for me . I noticed that i can also change the width of the image(From Css) without breaking the CRM interface.
The Only difference is in Changing the “Microsoft Dynamics CRM” text in the page . You will not find “Microsoft Dynamics CRM” in the NavBar.js any more.
You should go to the NavBar.js , look for class=”navTabLogoText”>{7} and Replace the {7} with Your Text , then look for class=”navTabButtonLink navTabLogoText”>{5} and Replace the {5} with Your text.
This worked for me . I hope this will help someone else .
Thanks
Hi ,
May I know to change the logo and text in MS CRM 2015.
Thanks in advance.
how can change Title of CRM logo in mobile view
Hi,
I am trying to configure the same thing in CRM 2013 on premise SP1 Version. However I coundn’t find Microsoft Dynamics CRM Text in NavBar.JS file. but i did find {6} and {5} instead of Text so I removed this dynamics value from JS file. Afterwards we replace the logo with our logo and did IISRESET. But logo in not displaying. We only want to show Logo not any Text.