How to customize Login Page
You can use your own branding and customize Login page of Client and Employee Portal according to your business as shown in the picture below.
You can only customize login page after you have setup custom domain. Login Page Customization settings will be available to you after you have successfully setup custom domain for your account.
We give you complete control over all parts of the login page. You can add your logo, choose colors, change image and even custom text. Lets see how you can customize Login page.
Customizing Login Page
You can customize login page by going to Settings - Custom Domain.
Here are the things you can customize for the Login page.
- Logo
- Logo Background color
- Background Image
- Custom Text
- Action Button
- Other things with CSS
Changing Logo on the Login Page
You can add your Logo to the login screen as shown in the picture below.
To add the logo go to the login page settings under Custom Domain Settings page. and click on the logo to choose the image file. After you have chosen the logo file click Submit.
We recommend that you use PNG file for the logo.
If you only want to change the logo then you can go ahead and click save to change the logo on the Login Screen.
Customizing Background Image
You can add custom background image on the login screen as shown in the picture below.
To add the custom background image, go to Login Page settings and choose the new background image as shown in the picture below.
After you have changed all of your desired settings click Update.
Changing Logo Background Color
You can also change the background color of your logo. This feature comes in handy when you have a light colored logo and white background and dark logo with dark background. Changing logo background color helps to make your logo visible.
To change logo background simply go to Login Page Settings and choose the logo background color as shown in the picture below.
You can copy and paste the Hex Code or you can use the color picker to select a color. After you have selected the color click Update.
Adding Custom Text On Login Page
You can add custom text on the login page as shown in the picture below.
To add custom text, enter your text into Custom Text settings on the login page and click Update.
Adding Call to Action On Login Page
You can add call to action button on the login screen. You can add your sales page url here or whatever you want. It is totally up to you.
To add the Call to Action button turn on the the Action Button switch in the login page settings. When you turn on the switch you will be given two input fiels.
Action Button Text: Enter what you want your button to say.
Action Button URL: Enter the URL where the user should be taken when they click on the button.
After you have added all the details click on Update to save the settings.
How to change Favicon?
To change favicon go to Login Page Settings and scroll down to Favicon option.
Choose the favicon ( It should be a square file 64 X 64 or 100 X100 and in png or ico format) and click the Update button to save the settings.
Custom CSS
If you know a little bit of CSS you can take this to a whole new level and change many things on the Login page according to your business.
Here are two examples. You can change the background color of the login form and change the color of the login button to whatever you want as shown in the picture below.
For this particular setting we have used the following CSS
.btn-primary { color: #fff; background-color: black; border-color: #346cb0; } .auth-form { background: antiquewhite; }
You can do a lot more than this. You just need to add custom CSS in the Custom CSS input field and click Update.