{"id":81,"date":"2010-06-27T18:44:00","date_gmt":"2010-06-27T18:44:00","guid":{"rendered":"\/lisa\/post\/2010\/06\/27\/Quicker-branding-of-SQL-Server-Report-Manager-2008-R2.aspx"},"modified":"2010-06-27T18:44:00","modified_gmt":"2010-06-27T18:44:00","slug":"quicker-branding-of-sql-server-report-manager-2008-r2","status":"publish","type":"post","link":"https:\/\/spacefold.com\/lisa\/2010\/06\/27\/quicker-branding-of-sql-server-report-manager-2008-r2\/","title":{"rendered":"Quicker branding of SQL Server Report Manager 2008 R2"},"content":{"rendered":"

A good long while ago<\/a>, I wrote a blog post about re-branding the Report Manager interface.  While at the time I thought it was not all that useful, because most developers create a custom interface to embed RS in their programs rather than actually show Report Manager to anybody, it’s become clear to me that Report Manager is very handy for administrators. There’s really no reason to re-invent the wheel by making all the appropriate SOAP calls into Report Server to re-write the manager interface, when administrators need to do lots of quick and dirty configuration behind the scenes. <\/p>\n

I also find that the branding tricks are a useful reminder of exactly which RS instance you’re working with, when you have a number of them floating around for different purposes. <\/p>\n

FWIW, I do the same thing for Sharepoint interfaces; even when a client isn’t going to see them, it’s handy to rebrand various sites, each set up fairly consistently, so that I know exactly what I am posting where without having to look at a bunch of breadcrumbs.<\/p>\n

So, with this in mind, I continued using the branding practices that I recommended in that earlier post, after we migrated to RS 2008.  They continued to work just fine.<\/p>\n

Or, we could talk some more.<\/h3>\n

I didn’t expect anything different when RS 2008 R2 came along.  Well, I was right and I was wrong. <\/p>\n

The good news is that the native interface is much less ugly.  Maybe some of you will feel less of a need to improve or re-style it than before, as a result.<\/p>\n

The other good news is that the general instructions I gave you in the earlier post are still right.  You still have to make the same config changes (which are minor) and look in the same places under ReportServer and ReportManager to make your CSS and image changes.<\/p>\n

The bad news is that the CSS and the actual images in use have changed significantly, and you can’t just plop your earlier images and CSS into the new folders and expect anything to work.  Although this time I knew what to do, without a bunch of false starts and experiments, I still had to re-do it.<\/p>\n

Given, as I said, that I want to re-brand all my Report Managers to keep them visually distinct from each other, and given that these sites are not exposed to end users, all I wanted to do was (1) get it done and (2) get it done.  I didn’t want to fuss.<\/p>\n

So, I’ve resolved the process into (I think) the smallest number of steps and, herein, I share those steps with you.<\/p>\n

First, here’s a preview of the result you can expect from following these steps.  If you haven’t looked at R2 yet, you’ll see that Report Manager now has a distinctly SP-modern appearance, much more pleasing, which I have not introduced (it comes this way out of the box.  All I’ve done is font- and color-brand it.  As I’ve indicated, I’ve done it very quickly —  but notice the branding is consistent all the way through the report run, even unto the “Wait” message:<\/p>\n

\"\"<\/p>\n

\"\"<\/p>\n

\"\"<\/p>\n

1. Formulate your general strategy for the brand<\/h3>\n

In my case, aside from changing the name of the site, this largely involves setting a base color to be different from the default blue (green, in this case) and picking the font I wanted to use.<\/p>\n

I also looked into the accent colors used for different elements, and determined that the “gold” color used as a secondary color would need to be changed to go with my new base.  Since I wasn’t using blue as my base any more, I decided I could use it as my secondary accent color, instead.  You can see it in the folder and data source icons, above.<\/p>\n

2. Carry out your color and font strategy through the CSS files<\/h3>\n

There are a couple of different CSS files in the Report Manager and Report Server Styles folders; change them all, even the ones you don’t think you need, and change them throughout, even if you think not all the classes are currently in use.  This will be easier than it sounds.<\/p>\n

The places to find these folders are exactly the same as they were before — refer to the earlier post<\/a> for full details on how to find, and how to treat, them.<\/p>\n

\"\"<\/p>\n

\"\"<\/p>\n

2a. Figure out a good way to exchange base color components<\/h5>\n

You can either look at every color value in the CSS files, or you can cheat.  Here’s how I cheated:<\/p>\n