Difference between revisions of "Branding"

[unchecked revision][checked revision]
 
 
(24 intermediate revisions by 5 users not shown)
Line 1: Line 1:
 
__NOTOC__
 
__NOTOC__
−
The appearance of MailStore Client, MailStore Web Access, and MailStore Outlook Add-in can all be easily customized to match your corporate design.  
+
The appearance of MailStore Client, MailStore Web Access, and MailStore Outlook Add-in can be customized easily to match your corporate design.  
  
 
== Modify and Activate Branding ==
 
== Modify and Activate Branding ==
Line 9: Line 9:
 
* Create a new folder named <tt>Branding</tt>.
 
* Create a new folder named <tt>Branding</tt>.
 
* Store all files necessary for branding in this newly created folder. Find further details about the branding parameters in [[#Client Branding|Client Branding]] and [[#Web Branding|Web Branding]] below.
 
* Store all files necessary for branding in this newly created folder. Find further details about the branding parameters in [[#Client Branding|Client Branding]] and [[#Web Branding|Web Branding]] below.
−
*: '''Important notice:''' The dimensions of the images must remain unchanged and no syntax errors must be made when editing JSON files. If necessary, test the JSON files at http://jsonlint.com/. Sample files can be found in the ‘Branding.sample’ folder located in the ''config'' subdirectory.  
+
*: '''Important notices:''' The dimensions of the images must remain unchanged and no syntax errors must be made when editing JSON files. If necessary, test the JSON files at http://jsonlint.com/. Sample files can be found in the ‘Branding.sample’ folder located in the ''config'' subdirectory. The ''about.html'' file needs to have an UTF-8 BOM (byte order mark) or else it cannot be loaded.
−
* Restart the Management Server service to activate the new branding.
+
* The ''title'' of the ''index.html'' page must be configured in ''index.html''. That page is shown when the Client Access Server (CAS) is accessed without any instance ID.
−
* Finally restart all the Client Access Server service on all server to refresh their local caches.
+
* [[Management Console - Logging On#Logging On|Log on]] to the Management Console, if not already logged on.
 +
* Navigate to ''Navigation > Developer > Management API'' and select ''ReloadBranding'' from the drop down menu then press ''Invoke'' to activate the new branding.
 +
 
 +
=== Limitations ===
 +
Some parts of the Client and Outlook Add-in cannot be branded as they are an integral part of the digitally signed installer packages (e.g. program icons) or are used at an early stage, where no branding information is available yet, like the ''Connect to E-mail Archive dialog''.
 +
 
 +
While the limited supported parameters allow to quickly create a decent branding without having to deal with CSS at all, not all color schemes are suitable to be used. Thus, a general recommendation is to use darker colors for backgrounds as certain non-brandable text color are white.
  
 
=== Client Branding ===
 
=== Client Branding ===
−
 
+
The following table provides information about the fields available for MailStore Client branding stored in <tt>ClientBranding.json</tt>. Required values for the MailStore Outlook App also need to be configured in this file.
−
The following table provides information about the fields available for MailStore Client branding stored in <tt>ClientBranding.json</tt>.
 
  
 
{| class="wikitable"
 
{| class="wikitable"
Line 31: Line 36:
 
|-
 
|-
 
| <tt>headerBackgroundColor</tt>
 
| <tt>headerBackgroundColor</tt>
−
| Background color of header, e.g. "#126d9c"
+
| Background color of header and hover color of buttons, e.g. "#126d9c".  Darker colors are recommended as some texts are using a non-brandable white color.
 
|-
 
|-
 
| <tt>headerLeftImage_autox95_png</tt>
 
| <tt>headerLeftImage_autox95_png</tt>
Line 43: Line 48:
 
|-
 
|-
 
| <tt>watermarkImage_300x150_png</tt>
 
| <tt>watermarkImage_300x150_png</tt>
−
| Watermark image. Required dimension: width: 300px; height: 150px
+
| Watermark image. Required dimension: width: 300px; height: 150px
 +
|-
 +
| <tt>gatewayName</tt>
 +
| Custom name that the MailStore Gateway archiving profile is listed under.
 +
|-
 +
| <tt>appPublisherName</tt>
 +
| Name of the Outlook App publisher, e.g. "YOURCOMPANY"
 +
|-
 +
| <tt>appPrivacyUrl</tt>
 +
| Privacy URL of the Outlook App publisher, must be https, e.g. <nowiki>https://yourexamplecompany.com/privacy</nowiki>
 +
|-
 +
| <tt>appTermsOfUseUrl</tt>
 +
| Terms of use URL of the Outlook App publisher, must be https, e.g. <nowiki>https://yourexamplecompany.com/termsofuse</nowiki>
 +
|-
 +
| <tt>appColorImage_192x192_png</tt>
 +
| Outlook App icon color image. Required dimension: width: 192px; height: 192px
 +
|-
 +
| <tt>appOutlineImage_32x32_png</tt>
 +
| Outlook App icon outline image. Required dimension: width: 32px; height: 32px
 
|}
 
|}
 +
 +
<p class="msnote">'''Important Notice:''' In order for the Outlook App to be uploaded to the Outlook app store, all URLs including the Help URL must begin with ''https''.</p>
  
 
=== Web Branding ===
 
=== Web Branding ===
−
 
 
The following table provides information about the fields available for MailStore Web Access and MailStore Outlook Add-in branding stored in <tt>WebBranding.json</tt>.
 
The following table provides information about the fields available for MailStore Web Access and MailStore Outlook Add-in branding stored in <tt>WebBranding.json</tt>.
  
Line 59: Line 83:
 
| <tt>webAbout_html</tt>
 
| <tt>webAbout_html</tt>
 
| HTML file containing the about site.
 
| HTML file containing the about site.
 +
|-
 +
| <tt>webRoot_html</tt>
 +
| HTML file to be used when no in instance was given in the URL.
 
|-
 
|-
 
| <tt>webHelpUrl</tt>
 
| <tt>webHelpUrl</tt>
Line 67: Line 94:
 
|-
 
|-
 
| <tt>webHeaderBackgroundColor</tt>
 
| <tt>webHeaderBackgroundColor</tt>
−
| Background color of header, e.g. "#126d9c"
+
| Background color of header and hover color of buttons, e.g. "#126d9c". Darker colors are recommended as some texts are using a non-brandable white color.
 
|-
 
|-
 
| <tt>webHeaderBackgroundImage_autox36_png</tt>
 
| <tt>webHeaderBackgroundImage_autox36_png</tt>
Line 73: Line 100:
 
|-
 
|-
 
| <tt>outlookAddinName</tt>
 
| <tt>outlookAddinName</tt>
−
| Name of the Outlook Add-in, e.g. "YOURCOMPANY - EMAIL ARCHIVE ADD-IN"
+
| Name of the Outlook Add-in, e.g. "YOURCOMPANY - EMAIL ARCHIVE ADD-IN".
 
|-
 
|-
 
| <tt>outlookAddinHelpUrl</tt>
 
| <tt>outlookAddinHelpUrl</tt>
Line 80: Line 107:
 
| <tt>watermarkImage_300x150_png</tt>
 
| <tt>watermarkImage_300x150_png</tt>
 
| Watermark image.  Required dimension: width: 300px; height: 150px
 
| Watermark image.  Required dimension: width: 300px; height: 150px
 +
|-
 +
| <tt>favicon_ico</tt>
 +
| Favicon in 16x16, 32x32, 64x64 pixel.
 +
|-
 +
| <tt>favicon_png</tt>
 +
| Favicon in 196x196 pixel in PNG format.
 +
|-
 +
| <tt>highlightColor</tt>
 +
| Color used for section titles, buttons and other controls, e.g. "#6aabce".
 
|}
 
|}
−
 
−
== What to do next ==
 
−
 
−
Hereby the installation and setup process of the MailStore Service Provider Edition is finished. All other administrative tasks are carried out through the web-based [[Management_Console_-_General| MailStore Management Console]].
 

Latest revision as of 09:36, 6 November 2024

The appearance of MailStore Client, MailStore Web Access, and MailStore Outlook Add-in can be customized easily to match your corporate design.

Modify and Activate Branding

Follow the instructions below to apply your own branding:

  • Open Windows Explorer on the Management Server.
  • Navigate to the config subdirectory of the MailStore Service Provider Edition installation. (Default: %PROGRAMFILES%\MailStore Infrastructure\config).
  • Create a new folder named Branding.
  • Store all files necessary for branding in this newly created folder. Find further details about the branding parameters in Client Branding and Web Branding below.
    Important notices: The dimensions of the images must remain unchanged and no syntax errors must be made when editing JSON files. If necessary, test the JSON files at http://jsonlint.com/. Sample files can be found in the ‘Branding.sample’ folder located in the config subdirectory. The about.html file needs to have an UTF-8 BOM (byte order mark) or else it cannot be loaded.
  • The title of the index.html page must be configured in index.html. That page is shown when the Client Access Server (CAS) is accessed without any instance ID.
  • Log on to the Management Console, if not already logged on.
  • Navigate to Navigation > Developer > Management API and select ReloadBranding from the drop down menu then press Invoke to activate the new branding.

Limitations

Some parts of the Client and Outlook Add-in cannot be branded as they are an integral part of the digitally signed installer packages (e.g. program icons) or are used at an early stage, where no branding information is available yet, like the Connect to E-mail Archive dialog.

While the limited supported parameters allow to quickly create a decent branding without having to deal with CSS at all, not all color schemes are suitable to be used. Thus, a general recommendation is to use darker colors for backgrounds as certain non-brandable text color are white.

Client Branding

The following table provides information about the fields available for MailStore Client branding stored in ClientBranding.json. Required values for the MailStore Outlook App also need to be configured in this file.

Name Description
clientName Name of the client application, e.g. "YOURCOMPANY - EMAIL ARCHIVE"
helpUrl URL to be opened when clicking on help in client.
loginHeaderImage_410x81_png Header image for login dialog. Required dimension: width: 410px; height: 81px
headerBackgroundColor Background color of header and hover color of buttons, e.g. "#126d9c". Darker colors are recommended as some texts are using a non-brandable white color.
headerLeftImage_autox95_png Left header image. Required dimension: width: auto; height: 95px
headerRightImage_autox95_png Right header image. Required dimension: width: auto; height: 95px
about_html HTML file containing the about site.
watermarkImage_300x150_png Watermark image. Required dimension: width: 300px; height: 150px
gatewayName Custom name that the MailStore Gateway archiving profile is listed under.
appPublisherName Name of the Outlook App publisher, e.g. "YOURCOMPANY"
appPrivacyUrl Privacy URL of the Outlook App publisher, must be https, e.g. https://yourexamplecompany.com/privacy
appTermsOfUseUrl Terms of use URL of the Outlook App publisher, must be https, e.g. https://yourexamplecompany.com/termsofuse
appColorImage_192x192_png Outlook App icon color image. Required dimension: width: 192px; height: 192px
appOutlineImage_32x32_png Outlook App icon outline image. Required dimension: width: 32px; height: 32px

Important Notice: In order for the Outlook App to be uploaded to the Outlook app store, all URLs including the Help URL must begin with https.

Web Branding

The following table provides information about the fields available for MailStore Web Access and MailStore Outlook Add-in branding stored in WebBranding.json.

Name Description
webName Name of the web application, e.g. "YOURCOMPANY - EMAIL ARCHIVE WEB ACCESS"
webAbout_html HTML file containing the about site.
webRoot_html HTML file to be used when no in instance was given in the URL.
webHelpUrl URL to be opened when clicking on help in web access.
webLoginHeaderImage_410x81_png Header image for login dialog. Required dimension: width: 410px; height: 81px
webHeaderBackgroundColor Background color of header and hover color of buttons, e.g. "#126d9c". Darker colors are recommended as some texts are using a non-brandable white color.
webHeaderBackgroundImage_autox36_png Header header image. Required dimension: width: auto; height: 36px
outlookAddinName Name of the Outlook Add-in, e.g. "YOURCOMPANY - EMAIL ARCHIVE ADD-IN".
outlookAddinHelpUrl URL to be opened when clicking on help in Outlook Add-in.
watermarkImage_300x150_png Watermark image. Required dimension: width: 300px; height: 150px
favicon_ico Favicon in 16x16, 32x32, 64x64 pixel.
favicon_png Favicon in 196x196 pixel in PNG format.
highlightColor Color used for section titles, buttons and other controls, e.g. "#6aabce".
Retrieved from "https://help.mailstore.com/en/spe/index.php?title=Branding&oldid=2102"