Logo Settings

It is necessary to customize logos, used in Jelastic dashboard, via JCA.

At the dashboard two logos are used:

at the sign-up/in window
in the top left corner of the dashboard

To place your own logos navigate to System Settings and configure the following parameters in the jclient expandable list:

HOSTER_LOGO
HOSTER_LOGO_SMALL

The value has to be of the following format:

{““url”":""[path]/[file].png”",““width”":""[img width]"”,““height”":""[img height]""}

The required size of the logos:

LOGO: 180-300px by 50-80px
SMALL_LOGO: 50-60px by 20-22px

Confirm the changes by clicking the Apply button.

Custom Logo for Activation Form

In order to set a separate logo image to be used at the account activation form, follow the next instruction:

1. Access the resources' application of your platform (app.{platform_domain}) via FTP:

connect platform via FTP

2. Once connected, upload a new logo file (with the .png extension), which should be displayed above the activation form, to the Images folder:

upload images

3. Then, either create a new activation folder inside the root public_html directory (if you haven’t the signup verification enabled yet) or just find and enter it.

Put the header.html file (which is used for stating the custom dashboard styles - see the details here) with your desired settings specified to this folder:

adjust header.html

Here is an example of the code, which can be inserted to the header.html file for defining the custom activation form’s logo:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
<style>
.logo {
  display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url('https://app.{platform_domain}/res/images/image.png') no-repeat;
  width: 180px; /* Width of new image */
  height: 236px; /* Height of new image */
  padding-left: 180px; /* Equal to width of new image */
}
</style>

Note: Due to the internal system requirements, we recommend providing this text in one line, e.g.:

1
<style>.logo{display:block;-moz-box-sizing:border-box;box-sizing:border-box;background: url('https://app.{platform_domain}/res/images/image.png') no-repeat;width:180px;height:236px;padding-left:180px}</style>

You can use the cssminifier.com service (or any other preferred of a kind) in order to minify your configuration for being displayed in such a way.

4. Once the new settings are saved, open the https://reg.{platform_domain}/activation/rebuild link in your browser in order to initiate the changes' appliance. As a result, the content of this file will be automatically fetched to the index.html page with activation form.

Logo Settings

Custom Logo for Activation Form

What’s next?