ローカリゼーション

ローカリゼーション

組み込みの翻訳機能を使って、dAppの言語をカスタマイズする

デフォルトでは、RainbowKitは英語ユーザーのためにen-USロケールをサポートします。

利用可能な場合、RainbowKitはユーザーの優先言語を検出し、適切な翻訳を選択します。開発者は常にデフォルト言語を上書きすることができます。

ユーザーに特定の言語を指定するには、RainbowKitProvider内で locale="zh-CN"をプロップとして追加するだけです。

import { RainbowKitProvider } from '@rainbow-me/rainbowkit';

export const App = () => (
  <RainbowKitProvider locale="zh-CN" {...etc}>
    {/* Your App */}
  </RainbowKitProvider>
);

RainbowKitのローカリゼーションサポートは、サブパスルーティングとの連携でさらに改善されます。

以下の例のようにNext.jsプロジェクトを設定し、ルートにオプションの/locale/サブパスを追加して、検索エンジンとユーザーが多言語サポートをさらに発見しやすくします。

// next.config.js
{
  i18n: {
    locales: ['default', 'en', 'zh-CN'],
    defaultLocale: 'default',
  },
}

その後、Pagesルーターが提供する locale をRainbowKitProviderに渡します。

import { RainbowKitProvider, Locale } from '@rainbow-me/rainbowkit';

export const App = () => {
  const { locale } = useRouter() as { locale: Locale };
  return (
    <RainbowKitProvider locale={locale} {...etc}>
      {/* Your App */}
    </RainbowKitProvider>
  )
};

Pagesルーターの例はこちらを参照してください。

App Routerはまだi18nをサポートしていません。次の例を参考にしてnext-intlミドルウェアを用いた実装のベストプラクティスを学んでください。こちら

dAppのコンテンツを翻訳するためには同じ技術を使用することをお勧めします。i18n-jsやnext-intlのようなローカリゼーションライブラリとCrowdinのような管理ツールはこのプロセスを簡素化します。

以下の locale リージョンに完全対応しています:

追加の言語サポートを希望する場合は、GitHub Discussionに投稿してください。できるだけ早くサポートできるようにします。