Customizing Style Sheets

  • Article

Cascading style sheets, found in files with .css extensions, allow the appearance of whole classes of visual HTML elements to be controlled from one central location. This includes, for example, the background colors and fonts used for various classes of elements.

Commerce Server Business Desk makes extensive use of two such style sheet files: Include\bizdesk.css and Include\navtree.css. The former is used to control the look of the content pane, and the latter is used to control the look of the navigation pane. Together, these two style sheets define a Business Desk "theme". Different themes can be chosen on the home page of Business Desk.

Microsoft Commerce Server 2002 comes with two themes defined: the default theme and a high-contrast theme, the latter of which is provided to improve accessibility. Additional themes can be added using the instructions provided in this topic.

The files Include\bizdesk.css and Include\navtree.css are interfaces to style sheet files in the Include\styles folder. The default theme is implemented by the files Default_bizdesk.css and Default_navtree.css, and the high-contrast theme is implemented by the files Hicont_bizdesk.css and Hicont_navtree.css.

You can change the appearance of Business Desk in two ways. The first way, which is recommended only for very minor changes, is to make modifications to the existing style sheet files for either the default or high-contrast themes.

The second way is to introduce an entirely new theme. You can create new themes by using following the steps, which are also included as comments in the ASP file Welcome.asp:

  1. Make copies of the pair of style sheet files that will provide the best starting point for developing your own theme. Typically, this will be the files Default_bizdesk.css and Default_navtree.css. The copies must be named using a common prefix that you choose. For example, Graytheme_bizdesk.css and Graytheme_navtree.css, for a grayscale theme.
  2. Modify the styles in the new files to your liking. It is probably best to change only colors, borders, and fonts.
  3. Add a new option element in the appropriate location in the ASP file Welcome.asp (look for where these instructions are repeated in that file). The value of the value attribute must be set to the file name prefix you have chosen; to continue the earlier example, you would set the value attribute to graytheme_. The data for the option element should be set to the theme name you want displayed in the drop-down control on the home page, perhaps "Shades of Gray."

For more information about the styles defined in the style sheet files, see Style Sheet Reference.

Ee798416.important(en-US,CS.20).gif Important

  • Extreme care should be exercised when changing styles because undesired effects might occur in other areas of Business Desk.

Copyright © 2005 Microsoft Corporation.
All rights reserved.