How to Re-brand Your Zimbra

Zimbra Collaboration Suite is an enterprise-class open source email, calendar and collaboration server. With the most innovative web application available today, Zimbra boosts the productivity of users on any desktop and dramatically reduces TCO compared to legacy platform vendors.
Other key advantages include advanced compatibility with existing desktop email clients, over-the-air sync to smart phones (iPhone, Android, BlackBerry) as well as better server scalability and more efficient administration.
This is an article that  that I have written to highlight some of the areas which one can customize to give the server a better look and feel. Note that you should apply this in compliance with the Zimbra license depending on the version your are using.


a.) To change the favicon:
The favicon is usually located in /opt/zimbra/jetty/webapps/zimbra/img/logo. You will need to overwrite this with your own icon! Simple!
b.) To change the Zimbra Logo
Simply navigate to /opt/zimbra/jetty/webapps/zimbra/img/logo

Replace the following logos with your own:
ImgZimbraIcon.gif
ImgZimbraIcon_20.gif
ImgZimbraIcon_64.gif

c.) To change the color of the screen:
Depending on the skin you are using you may change the color of the skin. Mostly zimbra will default to beach. To change the color of the skin simply navigate to: /opt/zimbra/jetty/webapps/zimbra/skins/beach
Open the file skin.properties  and change the skin colors to colors of your choice:
# Skin Colors #
#-------------------------------------------------------------#
#### Base color and variants ####
_BaseColor_ = #ff7373
_BaseColorD95_ = #0d0606
_BaseColorD90_ = #1a0c0c
Note: To see the changes made you must restart zimbra (zmmailboxdctl restart)

d.) How to change the page title
As zimbra user (su - zimbra):
vi /opt/zimbra/jetty/webapps/zimbra/WEB-INF/classes/messages/ZmMsg.properties
[change value for zimbraTitle = <new value>]
vi /opt/zimbra/jetty/webapps/zimbra/WEB-INF/classes/messages/ZhMsg.properties
[change value for zimbraTitle = <new value>]
The first is for the advanced client and the second is for the basic client.
You will need to restart jetty and clear your browser cache/restart browser to see change take effect

zmmailboxdctl restart

e.) How to change the login screen
To change the logo url open the login.js file under /opt/zimbra/jetty/webapps/zimbra/login
To add copyright

<td id="ZloginLicenseContainer">

&nbsp;&nbsp; <insert your code here>

 </td>

  

f.) How To Change Logo Zimbra With Your Own Logo on Login Page

Here’s how to change the logo Zimbra on the Login page with your own logo:
1. Make your own logo to the size 450 x 100 pixel, and save with format .png and give iits name LoginBanner.png
2. Copy (upload) to Zimbra Server  (Use a regular user should not use the root user). For example in the copy to the server zimbra by location, /home/agung/ .
3. Then Open console and login as root user . Then change as zimbra user. Follow the following command :

            su

            ########  (Your root password) 

            su - zimbra

4. Execute the following command to change zimbra logo with your own logo : ( Assuming that you install zimbra on folders /opt )

cp /home/agung/LoginBanner.png /opt/zimbra/jetty/webapps/zimbra/skins/_base/logos

If the override prompt appears, answer y .
5. Restart your zimbra service by typing the following code ( still as zimbra user ) . Note : Or you can restart your computer.

            zmcontrol stop

            zmcontrol start

6. Finished. It’s time to fun.
If the image displayed is a picture you made, you have managed to replace the banner logo zimbra server with your own logo.
************************************************************************


I just installed Zimbra 7.2.0 and the web front-end uses the carbon skin by default..so the path to edit those files are a bit different…and do not require a server restart to take affect. Here are the notes I made:



Here is how to change the logo Zimbra on the Login page with your own logo:

1. Make your own logo to the size 300 x 48 pixel, and save with format .png and give its name LoginBanner.png


2. Copy (upload) to Zimbra Server (//mail/share/LoginBanner.png –> which is /srv/samba/share/LoginBanner.png)


3. Login as root user and type the following commands:

cd /opt/zimbra/jetty/webapps/zimbra/skins/carbon/logos/
cp LoginBanner.png LoginBanner.bak
cp /srv/samba/share/LoginBanner.png .

4. Refresh the login page. NOTE: You might need to press CTRL+F5 to force a re-download of the image file in the browser.


Here is how to change or hide the little vmware logo on the login page:
1. Make your own logo (or empty image) to the size 71 x 11 pixel, and save with format .png and give its name AltBanner.png


2. Copy (upload) to Zimbra Server (//mail/share/AltBanner.png –> which is /srv/samba/share/AltBanner.png)


3. Login as root user and type the following commands:

cd /opt/zimbra/jetty/webapps/zimbra/skins/carbon/logos/
cp AltBanner.png AltBanner.bak
cp /srv/samba/share/AltBanner.png .

4. Refresh the login page. NOTE: You might need to press CTRL+F5 to force a re-download of the image file in the browser.


Here is how to change the Zimbra logo that sits at the top-left of the app window:
1. Make your own logo to the size 250 x 35 pixel, and save with format .png and give its name AppBanner.png


2. Copy (upload) to Zimbra Server (//mail/share/AppBanner.png –> which is /srv/samba/share/AppBanner.png)


3. Login as root user and type the following commands:

cd /opt/zimbra/jetty/webapps/zimbra/skins/carbon/logos/
cp AppBanner.png AppBanner.bak
cp /srv/samba/share/AppBanner.png .

4. Refresh the web page. NOTE: You might need to press CTRL+F5 to force a re-download of the image file in the browser.