Internationalization (i18n)

Overview

c15t supports internationalization (i18n) through the translations property in the ConsentManagerOptions object and has support for both server-side and client-side rendering.

c15t supports partial translations, letting you supply only the changed keys without passing the whole translations object. When a requested language isn't available, the system falls back to the configured default/base language. Client-side translations take precedence over server-side translations, so client values override server values.

Implementation

Pass the translations object in your ConsentManagerProvider options to configure the translations for your application.

import { ConsentManagerProvider } from '@c15t/nextjs';

export default function Layout({ children }: { children: React.ReactNode }) {
	return (
		<ConsentManagerProvider options={{
      // ... rest of your config
      translations: {
        defaultLanguage: 'en',
        translations: {
          en: {
            common: {
              acceptAll: 'Accept all',
            },
            cookieBanner: {
              title: 'Cookie Banner',
              description: 'This is a cookie banner',
            },
          },
        },
      },
    }}>
			{children}
		</ConsentManagerProvider>
	);
}

Types

TranslationConfig

Translations

CommonTranslations

CookieBannerTranslations

ConsentManagerDialogTranslations

ConsentTypeTranslations