ZCS Administrator's Guide, Network Edition 5.0 (Rev 5.0.19 September 2009)
Table of Contents Previous Next Index


Changing ZWC Theme Colors and Logo

Changing ZWC Theme Colors and Logo
You can change the logo and base colors of the Zimbra Web Client themes without having to customize individual ZCS themes. This can be done either from the CLI or from the administration console.
Changing the base colors for themes and adding a custom logo can be configured as a global setting or as a domain setting. When the global settings are changed, the changes apply to themes on all servers. When the domain settings are changed, the base color and logos for themes on the domain are changed.
If global settings and domain-level settings for theme base colors or logos are not the same, the domain values are displayed for the domain.
Important: If the logo and base colors are customized in multi-domain ZCS environments, you must set a virtual host as the base color and logo attributes are displayed based on the Host header sent by the browser. See “Virtual Hosts” on page 79.
Note: A number of Zimbra themes are included with ZCS. Some of these themes, such as lemongrass, Hot Rod, Waves and Yahoo, have been designed with graphics or color codes that are not changed, when you change the base color. You may want to disable those themes from user’s Theme preferences selection.
Customizing Base Theme Colors
The following base colors in ZWC themes can be changed:
The primary background color displayed in the client. This color is the background of the page. Variants of the color are used for buttons, background color of the Content and Navigation panes, tabs, and selection highlight. In the following image, the background color displays with the logo, the variant of the background color displays in the login area.
The secondary color is the color used for the toolbar, selection headers in the Navigation pane, and for a selected tab. In the following image, The selected tab, Mail, and the toolbar are displayed in the secondary color.
The selection color is the color displayed for a selected item such as a message, the clicked item from a right-click or other drop-down menu selection.
The foreground color is the text color displayed. The default text color is black. The text color usually does not need to be changed.
Replacing the ZWC Logo
You can replace the Zimbra log with your company’s logo globally or per domain.
Note: License Policy for Logo Replacement
The Zimbra Public License does not allow removing the Zimbra logo in the Zimbra Web Client. Only Network Edition customers can replace Zimbra logos that display in the Zimbra Web Client. Therefore, only customers of the Network Edition should use these instructions. Additional information about the license usage can be found at http:/www.zimbra.com/license/.html.
Graphics to Replace
The following Zimbra logo files can be changed. Your logos must be the same size as the specified here or the image may not display correctly. These graphic files can be saved on another server or in a directory that is not overwritten when ZCS is upgraded.
Company logo that displays on the login and splash screens for ZWC and the ZCS administration console. The dimension of the graphic must be exactly 450 x 100
Small company logo in the upper-left of the ZWC application and the administration console. The dimension of the graphic must be exactly 120 x 35.
Graphics not replaced
The Zimbra icon that displays in the Advanced search toolbar and the favicon.ico that displays in the URL browser address field cannot be changed at this time.
Using Command Line Interface to
Changing the ZWC theme base colors and logos is performed from the command line using the zmprov command.
Change Theme Colors
The color code is entered as a six-digit hexadecimal code.
Attributes
The following attributes are configured either as a global config setting or as a domain setting:
zimbraSkinBackgroundColor. Enter the hex color number for the primary background color displayed in the client.
zimbraSkinSecondaryColor. Enter the hex color number for the toolbar and selected tabs.
zimbraSkinSelectionColor. Enter the hex color number for the color of the selected item.
zimbraSkinForegroundColor. Enter the hex color number for the text. This usually does not need to be changed as the default is black.
How to change base colors for themes
Before you begin, identify the six-digit hexadecimal base color values for the various elements you are changing. The commands are entered as:
For Global:
zmprov modifyConfig <attribute-name> [“#HEX_6digit_colorcode”]
For Domain:
zmprov modifyDomain <domain> <attribute-name> [“#HEX_6digit_colorcode”]
To modify a domain
In this example, the following base colors are being changed:
1.
zmprov modifyDomain domainexample.com zimbraSkinBackgroundColor “#FF7F50” zimbraSkinSecondaryColor “#ADEAEA” zimbraSkinSelectionColor “#FFFF00”
The quote marks, “”, are required so the use of the # sign does not comment out the text that follows.
2.
zmmailboxdctl
ZCS themes for that domain now display these colors.
Add Your Logos
Attributes
You add the company logo information and URL by modifying these attributes:
zimbraSkinLogoURL. Enter the company Web address that you want linked from the logo.
zimbraSkinLogoLoginBanner. Enter the company logo file name that is displayed on the login and splash screens for the ZWC and the ZCS administration console.
zimbraSkinLogoAppBanner. Enter the logo graphic file name for the graphic in the upper-left of the ZWC application and the administration console.
To add logos for a domain
1.
zmprov modifyDomain domainexample.com zimbraSkinLogoURL http://example.com
zmprov modifyDomain domainexample.com zimbraSkinLogoLoginBanner http://imageserverexample.com/directory/logo_banner_name.png
zmprov modifyDomain domainexample.com zimbraSkinLogoAppBanner http://imageserverexample.com/directory/banner_app_logo.png
2.
zmmailboxdctl
Examples
Figure 10: Web Client before changing the base colors
Figure 11: Web Client Login Page after changing base colors
The base color and variations of the base color are displayed.
The Company logo displayed here and on the splash screen is 450 x 100.
Figure 12: Web Client after changing the base colors
Changing Theme Colors and Logo from Administration Console
On the administration console, the Global Settings and the Domains settings include a Themes tabs that can be configured to customize the color scheme and to add a company logo and logo URL. You upload your company logo to be used on the Zimbra Web Client and administration console pages.
Changing Base Theme Colors
You can change the same areas as changed from the CLI. You can either select colors from a color pallet table of defined colors or enter the six-digit hexadecimal color value for an exact color match.
On the Themes tabs, you can select a color from the pallet for each of the following areas.
Selection, which is the color displayed for a selected item such as a message, right-click, or drop down menu selection.
Adding Your Logo
You can replace the Zimbra logo with your company’s logo globally or per domain from the Themes tabs. Your logos must be the same size as specified here or the image may not display correctly. The graphic files are saved on another server or in a directory that is not overwritten when ZCS is upgraded.
The Zimlet icon that displays in the Advanced search toolbar and the favicon.ico that displays in the URL browser address field are not changed.
More Documentation
If you are interested in learning more about customizing ZWC colors and logos, see http://files.zimbra.com/docs/skins/Themes.html.
 

Changing ZWC Theme Colors and Logo

Table of Contents Previous Next Index
ZCS Administrator's Guide, Network Edition 5.0 (Rev 5.0.19 September 2009)
Copyright © 2009 Zimbra Inc.