Introduction

ISPManager is the most full featured cheap web hosting control panel. But most of the users find it’s too small font size difficult to read. The control panel doesn’t provide any web interface to change font size, font color and other style features. One obvious way is to increase font size of your browser. But as a web hosting provider we are unable to say that to client. So this post will explain how to customize those using CSS from provider’s end.

Disclaimer:  I got this solution from ISPManager official support. All images are obtained using Free Demo ISPManager 5 panel provided by ISPSystem official site.

Difficulty: Easy                       Time Required: Less than 5 minutes

 

Method

Although the control panel doesn’t provides any web interface to customize styles it provides a way to enter custom CSS under “Branding Settings”.

 

Step 1: Login as root

Login to ISPManager as root. You’ll find the control panel with default font size and styles as the following screenshot. 

 

Step 2: Select Branding under Settings

Click “Settings” from left panel. Select “Branding Settings”. Scroll down and expand the “HTML” tab. Here you can paste your custom CSS to achieve custom look of your brand.

 

Step 3: Paste your Custom CSS

Following is the example CSS I use for my web hosting company. You’re free to use your own custom code. Please follow the comments in the example code to understand which division is for what. Remember not to increase font size too much..!! It’ll go out of the border of divisions. So, it’s better to increase in small steps and see the result.

<style> /* Body font size */ .b-body, .b-input { font-size: 15px; } /* Selector and left menu font size */ #left #mainmenu .group li li a, #left #mainmenu .group li a.h-group, .b-myselect__select-value { font-size: 16px; } /* Selector menu font size */ .b-myselect__option-value { font-size: 14px; } /* Button font size */ .b-button { font-size: 16px; } /* Tabs font size */ .b-form-page__title { font-size: 16px; } /* Messages font size */ #modal_message, .modal_message { font-size: 18px; } /* Text area font size */ .b-textarea { font-size: 13px; } </style>

 

Step 4: Save and auto reload

Hit “OK” to save your custom code. The control panel will automatically reload with your changes. Compare the following figure with first one to see the changes.

 

Following the same approach you can change color and any other style settings using custom CSS. Again, please make changes in small steps. Else it may break the overall appearance of the control panel. From where it may become difficult to find and click links and follow the above steps.

 

This finishes our discussion regarding changing ISPManager control panel font size. For any confusion or suggestion please leave your comment. Additionally, you may contact Serverlog admin over email at admin[at]serverlog.net. Thank you for reading.