How-to customize the login screen of Checkmk

Owned by Anastasios Thomaidis
Last updated: Dec 11, 2023 by Matthew Hierholzer
3 min read
If you want to customize The Checkmk login screen,  depending on the edition, there are several ways to do that

LAST TESTED ON CHECKMK 2.2.0P1

Table of Contents

CME / MSE

Step-by-step guide

For the CME, there is a setting for every customer to upload a customized icon.

For the customers

  1. Go to Setup → Users → Customers and select the color palette for every customer you want to modify.
    Screenshot showing the Customers link location under the Users category.

    Screenshot of location of where the color palette icon is on the screen.
    ..

  2. Now you can upload a picture. The needed size of that picture is described in the inline help.
    Screenshot of the Login mask logo option enabled

    Screenshot of new customer logo uploaded.
    .

  3. Your customer will see that icon on the login screen and after the login.
    Screenshot of new customer logo on login screen

    Screenshot showing the new customer logo on the top left corner of the screen

    .

For the provider

  1. For the provider, there is no GUI way to do that. So we will need to work on the command line. Inside the Checkmk instance, we store the icons in the ~/share/check_mk/web/htdocs/themes/ directory.

    OMD[mysite]:~$ ls share/check_mk/web/htdocs/themes/

    So there is a way to create a local branch and add your custom icon. To achieve that successfully, you must use the same icon names stored in share/check_mk/web/htdocs/themes/. The name of that icon for the log in is mk-logo.png
    .

  2. The easiest way to move the icons to the provider is to copy the paths. Checkmk has two directories for the dark and light themes. In that example, I'm using root to copy both directories. After that, we must change the permissions to the Checkmk instance name.

    root@linux# cp -r /omd/sites/mysite/share/check_mk/web/htdocs/themes/* /omd/sites/mysite/local/share/check_mk/web/htdocs/themes/
root@linux# chown -R mysite:mysite /omd/sites/mysite/local/share/check_mk/web/htdocs/themes/*

    .

  3. Now you changed the login icon of the provider site successfully:

    Screenshot of new customer logo on login screen

In the CME, Checkmk tries to autoscale the icon automatically. In any other addition, that is not done. That's why you see an overlapping. 

In this case, there is also overlapping in the CME edition because the icon is much taller than wide. 

CEE

There is no way to upload an icon via the GUI in the CEE. So here, you need to do that manually, as described in the CME section. Ensure that in the CEE version, you will need two files for the login and navbar icons.

The name of the login icon: mk-logo.png, and the name of the navbar icon: checkmk_icon.png

➜  images cp /omd/sites/mysite/share/check_mk/web/htdocs/themes/facelift/images/mk-logo.png /omd/sites/mysite/local/share/check_mk/web/htdocs/themes/facelift/images/checkmk_icon.png
➜  images cp /omd/sites/mysite/share/check_mk/web/htdocs/themes/modern-dark/images/mk-logo.png /omd/sites/mysite/local/share/check_mk/web/htdocs/themes/modern-dark/images/checkmk_icon.png 
➜  images chown -R mysite. /omd/sites/mysite/share/check_mk/web/htdocs/themes/*


To find the other icon names, you can activate the network tools (F12) in your browser and inspect the elements:

Screenshot showing page inspector enabled detailing the image source


Additional login screen options

In the global setting (regardless of whether it's a CME or CEE), you will find an option to customize the login screen.

  1. Setup → General → Global setting → search for "login"
    Screenshot showing the customize login screen option under global settings
    .
  2. Here you can hide the Checkmk version, add a custom link, and put a custom login message.
    Screenshot of editing global settings with my company and its url.
    .
  3. After saving that, the login screen will look similar to below.
    Screenshot showing that the title and url have been updated on the login screen.

If you're running Checkmk in a distributed setup, you may want to do that in the site-specific global settings rather than globally!