How to customize Administration and Monitoring Console login page


How to customize Administration and Monitoring Console login page?


Note: It is highly recommended not to change any functional parts of the code. Only adding or removing UI elements are allowed. 

In order to customize Administration and Monitoring Console login pages, it is required to perform  changes in JS files. There are two login pages: the general login page and the tenant one. For the general login page, the \inetpub\wwwroot\FlexiCapture12\Login\Scripts\Pages\LoginPage.js file should be edited, for the tenant one, the \inetpub\wwwroot\FlexiCapture12\Login\Scripts\Pages\LoginTenantPage.js file should be edited. 

  1. Since login pages use JS, the page content will be displayed after all scripts run. Any changes performed before full page loading do not make any sense. Therefore it is needed to use EventListener. The sample can be found below:
    window.addEventListener("load", function(){
    //your code here
  2. DOM elements is found by any of standard js methods, such as getElementsByClassName, getElementByName, getElementById. The simplest way is to use the remove() method.

    For example, if it is needed to remove the Registration link from the login page, the code will look like this:

    window.addEventListener("load", function(){
    var registration = document.getElementsByClassName("link");


The same actions should be performed for the tenant Login Page, but the code should be written into the LoginTenantPage.js file.

Have more questions? Submit a request


1 comment

  • Avatar

    David Frontiñan

    This solution is not valid in IExplorer, if you use
    window.addEventListener("load", function(){
    });" instead, it works in all common browsers (tested on iexplorer, firefox and chrome/edge)


Please sign in to leave a comment.