Docs menu
MENU

Logo Settings

It is necessary to customize logos, used in the platform dashboard, via the admin panel.

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

  • HOSTER_LOGO - displayed at the dashboard’s sign-up/in window
  • HOSTER_LOGO_SMALL - shown at the top left corner of the dashboard

The value has to be of the following format:

1

{"url":"[path]/[file]","width":"[img width]","height":"[img height]"}

The required size of these logos:

  • LOGO: 180-300px by 50-80px
  • SMALL_LOGO: 50-60px by 20-22px
Note: Additionally, you need to provide the HOSTER_EMAILS_LOGO setting with logo for your emails. We recommend using the .png format for optimal display consistency across various email clients.

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 platform resources folder.

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

3. Then, either create a new activation folder inside the 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) with your desired settings specified to this folder.

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.

What’s next?