Keycloak customization

1

hi all,
i need to know how to generate custom Keycloak (24.0.5) build
that can i change in UI functionality or adding new components
and how can to deploy this generated build
i need clear steps for how to do this

2

Hi Mazen,

You’re asking for a tremendous amount of information but I can try to break it down into some steps.

Starting from a vanilla deployment, you can add themes to the /opt/keycloak/themes/ folder. FTL and properties files need to follow the same naming and formatting expected by the form provider to work. Take a look at Keycloak’s github project for references.

Custom code goes in the /opt/keycloak/providers/ folder; these can be JARs but must include the correct SPI META-INF data for Keycloak to find the providers in the classpath.

Setting a provider via configs requires configuration like --spi-<name of provider>-provider=<your provider id> to be added to the startup command. Several providers are singletons (BruteForceProtection, Cookie, Form) and you must specify them explicitly or the SPI lookup will fail.

New themes show up in dropdowns, you can override the base theme by setting the KC_SPI_THEME_WELCOME_THEME environment variable.

There’s a ton of documentation on the Keycloak website and examples if you search the internet. If you have a specific question about one of these I can try to answer it!

Hope this helps!

3

@ben.overcash thanks for your help , but how to add new screen ?, not to edit at ui style

4

Adding a new screen to the admin console would require some extensive work.

But you can extend the Keycloak application itself by adding a custom RealmResourceProviderFactory and RealmResourceProvider instance.

e.g. (pseudocode)

@AutoService(RealmResourceProviderFactory.class)
public class MyRealmResourceProviderFactory implements RealmResourceProviderFactory {

    @Override
    public RealmResourceProvider create(KeycloakSession session) {
        return new MyRealmResourceProvider(session);
    }

    ...

    @Override
    public String getId() {
        return "myapi";
    }
}


public class MyRealmResourceProvider implements RealmResourceProvider {
...
@Override
    public Object getResource() {
       return new MyCustomResource();
    }
}

import jakarta.ws.rs.*;

@Produces(MediaType.APPLICATION_JSON)
@Consumes(MediaType.APPLICATION_JSON)
public class MyCustomResource {

  @Path("/greetings")
  @GET
  public Response getGreetings() {
    Map<String,String> data = new HashMap<>();
    data.put("greeting","hello world");
    return Response.ok(data).build();
  }

}

This would make an endpoint for http://your-keycloak/realm/myrealm/myapi/greetings that would return a JSON object “{‘greeting’:‘hello world’}” when you call it.

You could just as easily generate an HTTP response with a new page and content.

This is just a high-level example; to do this securely you’d also need an authorization layer. Seems like a tricky thing to do correctly without accidentally introducing security vulnerabilities into the Keycloak instance.

1 Like