Auth0 Home Blog Docs

Lock screen customisation

lock

#1

Can you please provide a code sample or point me to a GitHub example of the lock screen customization. Nothing fancy, just looking to add my Logo and color. I did customize my passwordless screen but having trouble with the lock screen. My app is a single page Ang app.


#2

LMGTFY: https://auth0.com/docs/libraries/lock/v11/ui-customization

search terms used: auth0 lock customization


#3

Thanks. Is there a code sample I can download?


#4

Here is my code in the index.html. where would I instantiate color and logo. I tried and cant seem to get it to work. Thanks.

<meta charset="utf-8">

<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="//use.typekit.net/iws6ohy.js"></script>
<script>try {
    Typekit.load();
} catch (e) {
}</script>
<script src="https://cdn.auth0.com/js/lock/11.0.1/lock.min.js"></script>




<!-- font awesome from BootstrapCDN -->
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<link href="app.css" rel="stylesheet">





<div class="login-page clearfix">
    <div class="logged-in-box auth0-box logged-in" style="display: none;">
        <h1 id="logo"><img src="my logo.png"/></h1>
        <img class="avatar"/>
        <h2>Welcome <span class="nickname"></span></h2>
    </div>
</div>