How to translate body in Sanity with Next.js

5 replies
Last updated: May 23, 2023
hello @everyone anyone know how can i translate the body i'm using sanity with nextJs
AI Update

For translating body content in Sanity with Next.js, you have two main approaches, and the right choice depends on whether your "body" field uses Portable Text (rich text):

If your body field uses Portable Text (which is common for rich content), you should use document-level localization with the @sanity/document-internationalization plugin. This is the officially recommended approach because field-level translation with Portable Text can quickly hit Sanity's attribute limits and cause serious issues.

Install the plugin:

npm i @sanity/document-internationalization

With this approach, each language version becomes a separate document linked by shared references. So you'd have an English document, a French document, etc., each with their own body field. The plugin handles the relationship between these documents automatically using metadata fields like __i18n_base, __i18n_refs, and __i18n_lang.

Alternative: Field-level with sanity-plugin-internationalized-array

If you have simple fields (not Portable Text), you could use field-level translation with sanity-plugin-internationalized-array. However, this is explicitly not recommended for Portable Text/body fields because the complex block structure generates massive numbers of attributes when multiplied across languages.

For field-level translation, your schema would structure translations as nested objects:

{
  body: {
    en: "English content",
    fr: "French content"
  }
}

On the Frontend (Next.js)

In your Next.js app with document-level localization, you'll query the appropriate language version based on a language field:

const query = `*[_type == "post" && language == $lang][0]`

Then use Next.js internationalization features to handle routing and language switching (like /en/page vs /fr/page).

The document-level approach gives you cleaner data, better scalability, avoids technical limitations, and works perfectly with Portable Text - making it the best choice for most multilingual Sanity + Next.js projects.

I assume you mean this and not actually translation like i18n
if you do want to i18n than this is what you want https://www.sanity.io/docs/localization
Thank you
user J
yes i mean the portable-text i don't know how can i translate it

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Was this answer helpful?