Custom Login Page

Celoxis allows you to have your own login page on your website. We have a sample login page that you can customise to suit your needs.

Behaviour

If a user is already logged in, he/she will be automatically taken to the application and this page will not be shown. Also, when the user logs out, he/she will be taken to this page instead of Celoxis' login page.

What you need to customize

  • If you are on-premise customer, replace the URL in the head section with the correct version.
  • Put in your company code in the hidden field below (search for CHANGEME below).
  • You can style the page as you wish following the guidelines mentioned in the comments below.

Code

<html>
<head>
    <!-- Do not change the following line -->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <!-- If you use the on-premise version use the correct URL below -->
    <script id="celoxisloginscript" language="javascript"
            src="https://app.celoxis.com/psa/customLogin.js.do"></script>

    <title>Celoxis Custom Login Example</title>
</head>
<body>

    <!-- Error message will be displayed in the following div -->
    <div id="celoxiserror" style="color:red;display:none;">&nbsp;</div>

    <form method="post">

        <!-- Change the value parameter below with your company code -->
        <input type="hidden" name="code" value="CHANGEME"/>

        <!-- Do not change the following -->
        <input type="hidden" name="referrer"/>

        <!-- Do not change the name parameters -->
        Username:    <input type="text" name="username" />
        Password:    <input type="password" name="password" />
        Remember Me: <input type="checkbox" name="rememberme" value="true" />

        <button onclick="javascript:CeloxisAuth.customLogin(this.form);">
            Login
        </button>

    </form>

    <!-- The following will display the error in the div#celoxiserror above. -->
    <script language="javascript"> CeloxisAuth.handleError(); </script>
</body>
</html>