Customized Login form

Customized Login form

The following steps can performed to customise the default login page with a different image background.

1. Save a new page as Custom.HTML under [ManageEngine\ServiceDesk\Custom\Login]. This will return a totally blank login page with only the login information at the center. This proves the file works. 
2. Now edit the file and add the standard HTML values such as, 


<!DOCTYPE html> 
<html> 
<head> 
<title> Page Title</title> 
<style> 


3. Then add the LoginFormDiv which is an important value. 
4. Place the image required under [ManageEngine\ServiceDesk\Custom\CustomImages] folder. Then update the HTML file with the value parameter to add images and update it. 
5. Since the login details were moved to the centre we need to align it as per our requirement, so add the Height and Width parameters for that field, so that we can move it around as how we needed. 
6. Save the file, restart the application and everything works fine. 

If we need to change the colour of the text, adjust the values as to where the login section has to be moved, do "Inspect element" of the customised login page and update the values and see how they work, then use the same values on the file, save it and restart for the changes to take effect. 

PS: A sample file is attached.

                  New to ADSelfService Plus?

                    • Related Articles

                    • Login Page Customization -> SAML Login

                      NOTE: # No need to alter the changes in the application UI # Ensure to take a copy/backup of the below files before altering the same. STEPS TO FOLLOW: 1. Edit the file Login.html under <Drive>:\ManageEngine\ServiceDeskPlus-MSP\Server\Custom\Login ...
                    • Login Page customization

                      Change logo in the login page: -> First go to Global Settings --> Application Settings --> Customize login page -> From the insert image drop-down, you can upload the picture that you would like to show on the login page. Please make sure that the ...
                    • Customize Login page and add JS scripts

                      Customize Login Page Start by going to Advanced Portal Settings (or Application Settings under ESM Directory) and click on "Customize Now" under Login Page Customizaion Start editing the HTML content to suit your needs by adding style/css content, ...
                    • How to position the login form to the right side in the login page ?

                      Navigate to Admin->Self-Service Portal Settings->Login page customization->Customize now. Here modify the HTML code for Login form with the below values. position, you need to include manually. width:150% position: fixed;
                    • To center the Login page logo in SupportCenter Plus 11.0

                      By default, the logo for the login page in SupportCenter Plus is aligned to the left. Like below: To have the logo aligned to center, please go to Global Settings --> Application Settings  --> Customize now Under logo-heading, text-align: center; can ...