I18n
ShipNow has built-in i18n(internationalization) support. It supports multiple languages out of the box.
Overview
ShipNow's i18n feature includes:
- ➕ Easy to add a new language
- ⚙️ Centralized locale configuration
- 💻 Easy usage in server or client components
- 🔍 Automatic SEO metadata for different languages
- 🔀 Built-in Language switcher, Link components
- 🧭 Automatic language detection and routing redirection
Add a New Language
- Add the language to
config/locales.ts
:
The new language will automatically be available in the language switcher.
- Create a new translation file in
messages/
:
- Use the following Prompt, ask AI to translate the content:
- Update result content back to the translation file:
Update Translation Content
ShipNow's default language is English. You can update the translation content in messages/en.json
.
Use In Server Components
To use in server components, use the getTranslations
function:
Use In Client Components
To use in client components, use the useTranslations
hook:
Language Switcher Component
ShipNow includes a built-in language switcher component that allows users to change languages:
Link Component
Use the Link
component to navigate to the URL with the current language:
SEO
ShipNow automatically handles SEO metadata for different languages. The metadata is defined in the translation files and used in the layout:
This ensures that search engines receive the correct metadata for each language.
Only one language?
If your system has only one language, you can:
- Remove the extra language in
config/locales.ts
:
The language switcher will not display if there is only one language.
- Directly use any text in the component file, without needing to use
getTranslations
oruseTranslations
.
Need Help?
If you need help with i18n:
- Check the next-intl documentation
- Join our community Discord
- Open an issue on GitHub