How to customize login page and other templates?

[JohnPaton]

I'm trying to customize the login page with some additional information for users. Adding my own directory containing a native-login.html to c.JupyterHub.template_paths isn't enough apparently.

Example:

<!-- /custom/template/directory/native-login.html -->
{% extends "native-login.html" %}

{% block login %}
<p><strong>It worked!</strong></p>
{{ super() }}
{% endblock %}

# jupyterhub_config.py
...
c.JupyterHub.template_paths = ["/custom/template/directory/"]
...

[lambdaTotoro]

I've been looking into this for #79 and from the looks of it and the documentation says so, too.
There's an example on how to automatically give the correct path here, could you try that and see if it works for you?

[JohnPaton]

I'm not running this anymore so I don't have a setup to try it out on, sorry. But at a glance it doesn't look like the same issue, the question was about how to extend the provided templates as a user.

[lambdaTotoro]

That's true, but if you add the nativeauthenticator template directory to the configuration file as instructed over there you should be able to easily extend the templates as you do here.

But since you don't actually run this any more, I'll close this issue.

[unkcpz]

Just came across this issue and this is how we override the template, it requires a trick to modify the login handler since nativeauthenticator change it to native-login.html instead of the default login.html. Here is my jupyterhub config (https://github.com/aiidalab/aiidalab-microk8s-deploy/blob/0702fe11c22f85f3bb3094ddf1c44cb2c5aeb207/basehub/values.yaml#L77-L125):

jupyterhub:
    ... (other settings)
    hub:
        db:
            pvc:
                storageClassName: nfs-client
        extraConfig:
            00-logo: |
                c.JupyterHub.logo_file = "/usr/local/share/jupyterhub/static/external/aiidalab-wide-logo.png"
            01-auth: |
                from tornado.escape import url_escape
                from tornado.httputil import url_concat
                from nativeauthenticator import NativeAuthenticator
                from nativeauthenticator import handlers

                class CustomizeLoginHandler(handlers.LoginHandler):

                    def _render(self, login_error=None, username=None):
                        """For 'normal' rendering."""

                        return self.render_template(
                            "customize-native-login.html",
                            next=url_escape(self.get_argument("next", default="")),
                            username=username,
                            login_error=login_error,
                            custom_html=self.authenticator.custom_html,
                            login_url=self.settings["login_url"],
                            enable_signup=self.authenticator.enable_signup,
                            two_factor_auth=self.authenticator.allow_2fa,
                            authenticator_login_url=url_concat(
                                self.authenticator.login_url(self.hub.base_url),
                                {"next": self.get_argument("next", "")},
                            ),
                        )

                class CustomNativeAuthenticator(NativeAuthenticator):
                    def __init__(self, *args, **kwargs):
                        super().__init__(*args, **kwargs)
                        self.minimum_password_length = 8
                        self.check_common_password = True
                        self.ask_email_on_signup = True

                    def get_handlers(self, app):
                        native_handlers = [
                            (r"/login", CustomizeLoginHandler),
                            (r"/signup", handlers.SignUpHandler),
                            (r"/discard/([^/]*)", handlers.DiscardHandler),
                            (r"/authorize", handlers.AuthorizationAreaHandler),
                            (r"/authorize/([^/]*)", handlers.ToggleAuthorizationHandler),
                            # the following /confirm/ must be like in generate_approval_url()
                            (r"/confirm/([^/]*)", handlers.EmailAuthorizationHandler),
                            (r"/change-password", handlers.ChangePasswordHandler),
                            (r"/change-password/([^/]+)", handlers.ChangePasswordAdminHandler),
                        ]
                        return native_handlers

                c.Authenticator.admin_users = {'admin'}
                c.JupyterHub.authenticator_class = CustomNativeAuthenticator

and I have customize-native-login.html in the template path as modifing login.html as mentioned in the documentation

{% extends "native-login.html" %}

{% block title %}PSI AiiDAlab - Login{% endblock %}

....