Custom theme for admin console

180 views
Skip to first unread message

Gevorg Vardanyan

unread,
Sep 7, 2023, 10:17:35 AM9/7/23
to Keycloak User
Hi all.

I have downloaded keycloak 22.0.1 version and run it on my ubuntu machine.
It is working with defaults, but I need to do some customization in admin console.
I need to be able to apply some javascript code inside several admin pages.

I read https://www.keycloak.org/docs/latest/server_development/#_themes documentation and find that it can be done with admin themes.
I followed the steps, created required items, run server with recommended command, changed the realm theme for admin ui, restarted the server, but it does not work.

My added theme folder looks like this
│   ├── account
│   │   ├── resources
│   │   │   ├── css
│   │   │   │   └── account.css
│   │   │   └── img
│   │   │       ├── icon-sidebar-active.png
│   │   │       ├── keycloak-logo.png
│   │   │       └── logo.png
│   │   └── theme.properties

Could you please help me to create some admin theme to achieve my goal ?
Thanks in advance.

Regards
Gevorg

Stan Silvert

unread,
Sep 7, 2023, 3:40:25 PM9/7/23
to Gevorg Vardanyan, Keycloak User
Your theme folder is using account instead of admin.  But you are wanting to do this for admin console, right?

For the new React-based admin console, we aren't using the "scripts" property in the themes.properties file.  However, we are going to bring back this level of customization soon.

For now, we are recommending that you fork all the admin console code and modify it yourself.

But if your main goal is to just add some javascript, you could just deploy your own version of index.ftl in your theme.  It goes in the same folder as theme.properties.  I'm attaching a version of index.ftl that you can modify.  It should work.

--
You received this message because you are subscribed to the Google Groups "Keycloak User" group.
To unsubscribe from this group and stop receiving emails from it, send an email to keycloak-use...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/keycloak-user/41999a0b-11fe-4e98-8bc9-309db728976an%40googlegroups.com.
index.ftl

Gevorg Vardanyan

unread,
Sep 8, 2023, 2:58:10 AM9/8/23
to Keycloak User
Hi Stan, thanks for your answer.
I have modified my theme folder and now it looks like this:
../themes
└── test_theme
    └── admin
        ├── index.ftl
        └── resources

To start a server I use this command:
$ bash bin/kc.sh start-dev \
--http-port=7080 \
--spi-theme-static-max-age=-1 \
--spi-theme-cache-themes=false \
--spi-theme-cache-templates=false

I have restarted my server, selected test_theme for Admin UI theme, and again restarted the server just in case.
I have changed a page title and added a little javascript script code to test out index.ftl, but it does not work.

Do I make a mistake or is there anything that I missed ?

Thanks,
Gevorg.

Stan Silvert

unread,
Sep 8, 2023, 9:16:52 AM9/8/23
to Gevorg Vardanyan, Keycloak User
I would need more to go on.  Is there an error?  What does your theme.properties look like?

Reply all
Reply to author
Forward
0 new messages