Countly Enterprise Edition can be rebrandable and whitelabeled unlike Community Edition due to its custom open source license. In order to let Countly Enterprise Edition dashboard match with your company colors and brand for Enterprise Edition, you have two options.

1) Using white label plugin that comes with Enterprise Edition 2) Modifying CSS and HTML files manually.

Let's go over each step.

Option 1: Using white label plugin

Countly Enterprise Edition has a plugin called "white label" which helps you change user interface via a convenient user interface.

Here you can change many visuals like logo, page title, button, menu and font colors.

Option 2: Modifying CSS and HTML files

If you are going to change CSS styles, the first thing to do is to disable production mode. In 15.08 version you can do that by going to Management -> Configurations and Production mode: Disable.

In older versions, you must change countly/frontend/express/config.js to production: falseand restart your countly by executing restart countly-supervisor

This will enable that any changes you make to CSS styles would be visible on the dashboard immediately.

Modifying dashboard

All needed to do is to edit countly/frontend/express/public/stylesheets/main.css. There are commented sections, like /* FOOTER */, /* SIDEBAR */, /* DASHBOARD */, so it should be relatively easy to find what out want to modify.

If you want to modify HTML pages, then you should look at countly/frontend/express/views/dashboard.html - there are all templates for each Countly view.

All images are stored in countly/frontend/express/public/images

Modifying pre-login pages

If you want to modify pages that are showed before logging in to dashboard, like login page or forgot password page, refer to the following templates and CSS files:

• CSS are stored in countly/frontend/express/public/stylesheets/pre-login/main.css
• HTML templates stored in countly/frontend/express/views
• Images are stored in countly/frontend/express/public/images/pre-login

Modifying plugins

Some functionalities are separately available inside plugins, so if you want to modify them, you must look for specific plugin directory. Usually it is countly/plugins/PLUGIN_NAME/frontend/public/stylesheets/main.css for CSS and countly/plugins/PLUGIN_NAME/frontend/public/templates/ for templates. Images are also in respective countly/plugins/PLUGIN_NAME/frontend/public/images directory.

Preparing production files

After you make you modifications and like everything you have done, it's time to prepare minified production files and switch back to production mode for optimized page loading.

In order to switch to prepare production files in version 15.08 and greater, you can execute:

# countly upgrade 

And then go to Management > Configurations and set Production mode to Enable. That's everything required for v15.08 and later.

If you have version 15.03, you can change into your countly directory and execute:

grunt dist-all

After that, change countly/frontend/express/config.js production property to true and execute:

restart countly-supervisor

Other files

These are the files that you may need to modify in order to provide a more branded version:

• Title, page and footer text is located in /frontend/express/version.info.js
• For email sender field, api/parts/mgmt/mail.js file should be modified.