After creating a dashboard, the customer typically asks to have their logo and colors added so their organization branding is available.  Using the SAS Flex Theme Designer, you can change the SAS BI Dashboard colors and logos. In this post I showed you some basics for using the SAS Flex Theme Designer but today, let’s change the logo and apply the company’s colors.

Let’s pretend that Acme Products is your latest customer and add their branding to the dashboard. Here’s their company logo and the colors they want to incorporate into their new dashboard theme.

Some tips:

• Acme Products uses a light gray (#838383) and a gold (#FFD34E) as their corporate colors. It’s easier to make changes if you know the exact  HEX colors. [More about HEX colors]   Otherwise, you get into a “not gold enough“ scenario where you are re-doing the colors multiple times.
• The customer has supplied the logo as a file called ACME_logo_Small.png.  Other graphic file formats (.JPG or .TIF) will work. I like PNGthe best – it’s a newer graphic format. Your situation may call for a different format so use what works best for you.Ask for the logo to be about 35-40 pixels tall for the best results. Here’s why – the first logo was only slightly taller (49 pixels) so I used the Flex Designer controls to reduce it.  Yuck …  jaggy edges – looks blurry!  However, the artist reduced the second one to 38 pixels and the end results was no more jaggies.
  

Making the Dashboard Theme Change

Here’s the basics for changing things up.

• Open and log in to the SAS Flex Theme Designer. [Review this post for details on how to find the tool and required permissions.]
• Select File > New.  In the pop-up window, provide a name for your theme and a default theme.When you create the new theme, base it on an existing theme (SAS Dark or SAS Light) so select the one closest to your chosen style or theme.  For this example, we will use SAS Light.  Remember - SAS Corporate only supports changing the logo. Thus if you make changes, you will not see them and after you repeat the action a dozen times without seeing results - you will go insane and run from your desk screaming like a wild boar.
• In the User Interface Components, select Application Banner.  The User Interface Components lists the general areas of the dashboard where you can make changes.
  1.  In the Logo area, browse for your logo file and click Open to add it to the theme.
     You can change the size of the logo if needed using the Scale(%) box.
  2. Set the Text Color to the Gold (#FFD34E).
     You may have to use the custom menu to type the Hex code by selecting Custom Color.The changes are shown immediately so you make adjustments.
• From the User Interface Components box,  click Application Frameso we can change the surrounding frame.
  1. Un-check the Image scale(%) check box. There may be an image behind the
  2. Change the Color to the one that you want.
     Our customer wanted Gray (#838383). You can set the RGB or HEX for the color by selected Custom Color.
• Select File > Save and Deploy.
• Set the new theme as the default theme. [Refer to this post for help.]
• Click Log Off and close the Web browser window.
• Open the BI Dashboard to review the results.

What About You?

Have you used the Theme Designer to change-up a look?  Have any tips you want to share – please post them in the area below

Note: You can find out more about the application abilities and limitations in the SAS user docs:   SAS® Theme Designer 3.4 for Flex: User’s Guide.

Tags: configuration, Dashboards, SAS 9.3