Branding Microsoft CRM & Reclaiming A Little Screen Real Estate

The Problem

When my company first looked at Microsoft CRM a few years ago there were two immediate questions.

1. (From the higher ups) How can we brand Microsoft CRM, so that our users know it as Company ABC CRM?
2. (From the tech folks)  Can you please give me back the 100 + pixels of screen real estate at the top of the screen?

As you can see Microsoft is nice enough to insert a massive Microsoft Dynamics CRM logo which takes up a good 15% of your screen real estate and of course kills any chance of branding Microsoft CRM.  Not to mention the fact that the title of every page begins with “Microsoft Dynamics CRM”.

Solution

But what can you do?  It’s their sandbox right?  You have to play by their rules.  Well, kind of.  If you followed my previous post, I talked about how we can insert jQuery and our own custom JavaScript file right into Microsoft CRM.  Well, here’s a good example of what this opens up for us.

In our inserted JavaScript file we could have something like this:

$(document).ready(function() {    UpdateHeader();});

function UpdateHeader(){    $("FRAMESET").each(function() {    if ($(this).attr("rows") == "112,*") {    $(this).attr("rows", "80,*");    }    });

    $("#tdLogoMastHeadBar").css("background-image", "url()").css("font-weight", "bold").height("20px");    if ($("#tdLogoMastHeadBar").html()) {    $("#tdLogoMastHeadBar").html($("#tdLogoMastHeadBar").html().replace("
", " "));    }    $(".ms-crm-MastHead-SignIn-Org").css("margin-left", "7px").css("margin-right","7px").text("");    $("#leftContextTD").height("20px").next("td");    $(".ms-crm-ContextHeader-Title").css("padding-top", "5px");

    if(document.title == "Microsoft Dynamics CRM"){         document.title = "ABC Company CRM";    }

}

In this snippet we do 3 basic things:

1. We find the frame set with the header in it and reduce the rows.  Make it smaller.  Reclaim the real estate.
2. We clear out the background images, remove some <BR> tags, adjust some margins.  Basically clean up the header to make it more like something we like.
3. Finally, remove MS’s title in favor of our own.

And the results will be something like this:

Summary

Here we saw an example of how we can use some inserted JavaScript to change the look/feel of Microsoft CRM to fit our needs.  As usual things like this come with the same disclaimer I had on my previous post and of course my overall blog disclaimer.  Good luck!