Terms and Conditions Page

The Tems and Condition feature of Keycloak enables you to make new users of your service consent to the terms of use of your services upon regisering.

Keycloakify Storybookstorybook.keycloakify.dev

Preview of the default terms.ftl page

Preview of the the term and condition page.

Enabling the feature

If you want you show your terms and condition page when they create an account you have to enable it in your realm configuration.

This is how to do it in the Keycloak Admin Console:

• Navigat to your realm

• Left bar item: Authentication

• Tab: Required Actions

• Terms and condition: Enabled & Set as Default Action

Defining your Terms and Conditions text

The way of defining your terms of services in Keycloak is to provide a message bundle for your realm that overrides the termsText key for the different languages that you have enabled.

In recent Keycloak's versions this can be acheived directly via the Keycloak Admin Console as shown in this video:

If you want to use an iframe as text read this.

Customizing how the terms are rendered

If you want to customize the page that display the terms and condition you have to eject the terms.ftl page.

npx keycloakify eject-page
# Select login -> terms.ftl

This will create src/login/Terms.tsx in your project.

You also probably want to add a story for the Term page:

npx keycloakify add-story
# Select login -> terms.ftl

In src/login/Terms.tsx, note that msg("termsText") returns a JSX.Element. It's because the msg() function renders the string message as HTML text. You can't work directly with that.

If you want to apply transformation to the text, you should use msgStr("termsText") instead. This returns the original string as defined in your realm configuration.