Custom theme for Keycloak
This article describes how to add a custom theme to the Keycloak managed service in CodeNOW.
Prerequisites
Steps
1. Set up application for the theme
- Create a new application.
- Create docker-generic component.
- Add your custom theme to the
theme
directory. - Add the code below to your
Dockerfile
:- It will take the content of the
theme
directory and copy it to the filesystem of the docker container (in the directory/custom
).
- It will take the content of the
FROM busybox
COPY theme /custom
- Push the changes and build the component.
- After successful build create a new application package.
2. Configure Keycloak
caution
After making changes to an existing theme, consider clearing the cache of your browser. Otherwise, your theme might not load properly.
- Copy link to access the docker image.
- Go to the detail of your Keycloak managed service.
- Scroll down to
Configuration
and do the following:- Enable custom theme.
- Paste the copied docker image in the
Custom theme image
text field. - Click on
Submit
.
- After the pod is reloaded with the new theme (
Status
=Ready
), click on the Admin Panel and login to the Administration Console. - Go to
Realm settings -> Themes
and select thecustom
theme option. Submit your changes by clickingSave
.