Headless CMS + PolyLingo

Wielojęzyczność dla headless CMS.

Polylang zapewnił witrynom WordPress kompletny workflow wielojęzyczny. PolyLingo przenosi ten workflow do Sanity, Contentful, Webflow, Framer i każdego innego headless CMS — przez REST API, które integruje się w jedno popołudnie.

Sanity
pełny przykład integracji
Contentful
pełny przykład integracji
Webflow
pełny przykład integracji
36
docelowe języki

Wielojęzyczność w headless CMS to nierozwiązany problem.

Sanity ma wtyczkę do internacjonalizacji. Contentful ma lokalizacje. Ale żaden z nich nie tłumaczy twoich treści — po prostu przechowują je w wielu językach. Wypełnianie tych miejsc językowych to nadal proces ręczny. Eksportuj treść po angielsku, przetwarzaj ją przez narzędzie tłumaczeniowe, które psuje twoją strukturę rich text lub JSON, popraw wynik, importuj z powrotem, powtarzaj dla każdego języka. Dla aktywnego zespołu publikującego regularnie ten workflow nie skaluje się. Nie istnieje też dla większości mniejszych setupów, co oznacza, że treść po prostu nigdy nie jest tłumaczona.

Architektura headless CMS oddziela zarządzanie treścią od jej dostarczania. To dobre dla elastyczności. Ale tworzy lukę: CMS przechowuje warianty językowe, ale nic ich nie wypełnia przetłumaczoną treścią. Musisz zbudować tę warstwę samodzielnie.

Większość zespołów kończy w jednej z dwóch sytuacji: ręcznie tłumaczą treść, kopiując ją do DeepL i wklejając z powrotem (wolne, podatne na błędy, nie skaluje się), albo piszą niestandardową integrację z API tłumaczeniowym, którą muszą utrzymywać na zawsze. Żadne z tych rozwiązań nie jest dobre. PolyLingo to czysta trzecia opcja.

PolyLingo to warstwa tłumaczeń, której brakuje twojemu CMS.

PolyLingo integruje się bezpośrednio z workflow publikacji twojego CMS. Skonfiguruj webhook, który uruchamia się przy publikacji treści, przekaż treść do PolyLingo, odbierz przetłumaczone wersje dla każdego języka, zapisz je z powrotem do CMS. Dla Sanity to kilka linijek w akcji serwera. Dla Contentful to handler webhooka. Dla niestandardowych setupów to wywołanie HTTP. Model tłumaczenia rozumie format twojej treści — Markdown, HTML, JSON, rich text — i zachowuje strukturę przez cały czas.

Wzorzec jest spójny dla każdego CMS: pobierz treść w języku źródłowym, wywołaj API PolyLingo ze wszystkimi językami docelowymi, zapisz przetłumaczoną treść z powrotem do CMS przez jego API zarządzania. To działa jako skrypt budujący, zadanie CI lub handler webhooka — w zależności od twojego workflow.

PolyLingo obsługuje Markdown, HTML i zwykły tekst, więc działa z dowolnym formatem, którego używa twój CMS dla bogatej treści. Pola strukturalne (nagłówki, treść, streszczenie) można tłumaczyć indywidualnie, dając ci precyzyjną kontrolę nad tym, które pola są tłumaczone.

🟠

Sanity + PolyLingo

Wtyczka Document Internationalization Sanity tworzy powiązane warianty dokumentów dla każdej lokalizacji. Poniższy skrypt pobiera bazowe dokumenty po angielsku i automatycznie tworzy przetłumaczone warianty dla każdego języka docelowego.

Działa z wzorcem i18n na poziomie dokumentu (jeden dokument na lokalizację) oraz wzorcem na poziomie pola (wszystkie lokalizacje w jednym dokumencie). Dla wzorca na poziomie pola iteruj po polach, a nie dokumentach.

scripts/translate-sanity.mjs
// scripts/translate-sanity.mjs
// Fetches published posts and translates each to all target languages

import { createClient } from '@sanity/client'

const sanity = createClient({
  projectId: process.env.SANITY_PROJECT_ID,
  dataset: 'production',
  token: process.env.SANITY_TOKEN,
  apiVersion: '2024-01-01',
  useCdn: false,
})

const posts = await sanity.fetch(`*[_type == "post" && __i18n_lang == "en"]`)

for (const post of posts) {
  const response = await fetch('https://api.usepolylingo.com/v1/translate', {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${process.env.POLYLINGO_API_KEY}`,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      content: post.body_markdown,
      format: 'markdown',
      targets: ['es', 'fr', 'de', 'ja', 'zh'],
    }),
  })

  const { translations } = await response.json()

  for (const [lang, content] of Object.entries(translations)) {
    await sanity.create({
      _type: 'post',
      __i18n_lang: lang,
      __i18n_base: { _type: 'reference', _ref: post._id },
      title: translations[lang + '_title'] || post.title,
      slug: { current: `${post.slug.current}-${lang}` },
      body_markdown: content,
    })
  }
}
🔵

Contentful + PolyLingo

Contentful przechowuje warianty lokalizacji jako pola w tym samym wpisie. Poniższy skrypt używa Contentful Management API do pobrania wpisów po angielsku, przetłumaczenia ich i zapisania przetłumaczonej treści bezpośrednio do pól specyficznych dla lokalizacji — bez ręcznego kopiowania i wklejania.

Contentful używa kodów lokalizacji BCP 47 (np. es-ES zamiast es). Mapuj kody ISO 639-1 PolyLingo odpowiednio do konfiguracji lokalizacji Contentful.

scripts/translate-contentful.mjs
// scripts/translate-contentful.mjs
// Translates Contentful entries to all target locales

import contentful from 'contentful-management'

const client = contentful.createClient({
  accessToken: process.env.CONTENTFUL_MANAGEMENT_TOKEN,
})

const space = await client.getSpace(process.env.CONTENTFUL_SPACE_ID)
const env = await space.getEnvironment('master')
const entries = await env.getEntries({ content_type: 'blogPost', locale: 'en-US' })

for (const entry of entries.items) {
  const enBody = entry.fields.body['en-US']

  const response = await fetch('https://api.usepolylingo.com/v1/translate', {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${process.env.POLYLINGO_API_KEY}`,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      content: enBody,
      format: 'markdown',
      targets: ['es-ES', 'fr-FR', 'de-DE'],
    }),
  })

  const { translations } = await response.json()

  for (const [locale, content] of Object.entries(translations)) {
    entry.fields.body[locale] = content
  }

  await entry.update()
  await entry.publish()
}
🌀

Webflow + PolyLingo

API lokalizacji Webflow (dostępne w planach CMS i Business) obsługuje treść pól specyficznych dla lokalizacji. Poniższy skrypt pobiera elementy kolekcji CMS, tłumaczy pole treści HTML i zapisuje tłumaczenia z powrotem do każdej wariantowej lokalizacji przez Webflow v2 API.

Webflow przechowuje pola rich text jako HTML. Tłumaczenie HTML przez PolyLingo zachowuje cały markup generowany przez Webflow — niestandardowe klasy, atrybuty i osadzone elementy — bez zmian.

scripts/translate-webflow.mjs
// scripts/translate-webflow.mjs
// Webflow Localization API + PolyLingo

const headers = {
  'Authorization': `Bearer ${process.env.WEBFLOW_API_TOKEN}`,
  'accept-version': '2.0.0',
  'Content-Type': 'application/json',
}

// Fetch English CMS items
const itemsRes = await fetch(
  `https://api.webflow.com/v2/collections/${process.env.WEBFLOW_COLLECTION_ID}/items`,
  { headers }
)
const { items } = await itemsRes.json()

for (const item of items) {
  const response = await fetch('https://api.usepolylingo.com/v1/translate', {
    method: 'POST',
    headers: {
      'Authorization': `Bearer ${process.env.POLYLINGO_API_KEY}`,
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      content: item.fieldData['body-html'],
      format: 'html',
      targets: ['es', 'fr', 'de'],
    }),
  })

  const { translations } = await response.json()

  // Write translated content back to Webflow locale fields
  for (const [lang, content] of Object.entries(translations)) {
    await fetch(
      `https://api.webflow.com/v2/collections/${process.env.WEBFLOW_COLLECTION_ID}/items/${item.id}/locales/${lang}`,
      { method: 'PATCH', headers, body: JSON.stringify({ fieldData: { 'body-html': content } }) }
    )
  }
}

Co PolyLingo daje użytkownikom headless CMS

  • Sanity — tłumacz podczas publikacji przez webhook, zapisz z powrotem do lokalizacji dokumentu
  • Contentful — automatycznie tłumacz wpisy, gdy aktualizowana jest lokalizacja angielska
  • Webflow — tłumacz elementy kolekcji CMS przez API
  • Każdy headless CMS z API — wzorzec integracji jest taki sam
  • Rich text, Markdown i HTML zachowane poprawnie
  • Wszystkie 36 języków w jednym żądaniu — bez wywołań na język
  • Działa z każdym CMS, który ma API zarządzania
  • Treść może być ponownie tłumaczona przy każdej publikacji — bez ręcznej synchronizacji

Standardowy workflow wielojęzycznego CMS

1

Napisz treść w języku źródłowym

Twórz i publikuj treść po angielsku (lub w dowolnym języku źródłowym). Twój CMS przechowuje ją jako wersję autorytatywną. Nie musisz zmieniać swojego workflow redakcyjnego.

2

Uruchom skrypt tłumaczący

Uruchom skrypt ręcznie, według harmonogramu lub przez webhook wyzwalany przez zdarzenia publikacji w CMS. Skrypt wywołuje PolyLingo raz na dokument ze wszystkimi językami docelowymi, a następnie zapisuje wszystkie tłumaczenia z powrotem do CMS za jednym razem.

3

Wdróż — przetłumaczona treść jest dostępna

Twój frontend odczytuje treść specyficzną dla lokalizacji z CMS jak zwykle. Nie są potrzebne zmiany w kodzie frontendu. Przetłumaczona treść pojawia się w odpowiednim języku dla każdej ścieżki lokalizacji.

Dla kogo to jest stworzone

✍️

Zespoły redakcyjne na Sanity lub Contentful

Twoi redaktorzy publikują po angielsku. Przetłumaczona treść pojawia się automatycznie we wszystkich lokalizacjach, bez konieczności korzystania z narzędzi tłumaczeniowych przez zespół redakcyjny.

🏢

Agencje tworzące witryny wielojęzyczne

Każda witryna klienta, którą tworzysz, potrzebuje wsparcia wielojęzycznego. PolyLingo daje ci wielokrotnego użytku, rozliczalną integrację działającą z każdym headless CMS w twoim stacku.

🌍

E-commerce z lokalizowanymi treściami produktowymi

Opisy produktów, strony kategorii i treści blogowe — wszystko tłumaczone automatycznie podczas publikacji. Połącz z lokalizowanymi cenami, aby dostarczyć w pełni spersonalizowane doświadczenie zakupowe.

Najczęściej zadawane pytania o wielojęzyczność w headless CMS

Czy PolyLingo działa z CMS-ami nie wymienionymi tutaj?

Tak. Każdy CMS z API zarządzania można zintegrować tym samym wzorcem — pobierz treść, wywołaj PolyLingo, zapisz z powrotem. Prismic, Storyblok, DatoCMS, Strapi, Ghost i Directus mają API zarządzania i działają z tym podejściem. Przykłady integracji dla Sanity, Contentful i Webflow powyżej ilustrują ten wzorzec.

Czy mogę tłumaczyć rich text z osadzonymi obrazami i linkami?

Tak. Tłumaczenie HTML zachowuje wszystkie osadzone elementy, w tym obrazy (atrybuty src i alt obsługiwane poprawnie), linki (href zachowane, tekst linku tłumaczony) oraz iframe. Jedynym wyjątkiem są treści wyraźnie oznaczone jako nietłumaczalne — np. bloki kodu nigdy nie są tłumaczone.

Jak obsłużyć treści, które nie powinny być tłumaczone?

Dla treści strukturalnych z polami nietłumaczalnymi (slug, daty, identyfikatory techniczne) wyślij tylko pola, które chcesz przetłumaczyć. Dla rich text z mieszanymi sekcjami tłumaczalnymi i nietłumaczalnymi użyj formatu HTML — PolyLingo przetłumaczy tekst, zachowując bloki kodu i inne elementy strukturalne automatycznie.

Co jeśli mój CMS ma zagnieżdżone typy treści?

Dla głęboko zagnieżdżonych treści (dokumenty z odwołaniami do innych dokumentów) tłumacz każdy typ dokumentu niezależnie. Unika to referencji cyklicznych i daje czystą kontrolę nad tym, co jest tłumaczone. Odwołania między dokumentami są utrzymywane przez CMS — PolyLingo dotyka tylko treści pól, nie relacji dokumentów.

Jak utrzymać synchronizację tłumaczeń, gdy zmienia się treść źródłowa?

Zalecany wzorzec to wyzwalanie skryptu tłumaczącego przy każdym zdarzeniu publikacji przez webhook CMS. To zapewnia aktualizację tłumaczeń za każdym razem, gdy zmienia się treść źródłowa. Dla rzadszych aktualizacji można uruchamiać skrypt według harmonogramu nocnego lub przed każdym wdrożeniem produkcyjnym.

Czy jest sposób, aby oznaczyć tłumaczenia jako "wymagające przeglądu" zamiast publikować je automatycznie?

To zależy od twojego CMS. Contentful i Sanity obsługują stany robocze — możesz zapisywać przetłumaczoną treść jako wersję roboczą zamiast opublikowanej, co pozwala na przegląd przez człowieka przed udostępnieniem każdej lokalizacji. Przykłady skryptów powyżej używają natychmiastowego publikowania/tworzenia; zmodyfikuj ostatni krok, aby tworzyć wersje robocze dla workflow przeglądu.

Dodaj wielojęzyczność do swojego headless CMS już dziś.

Darmowy plan. 100 000 tokenów miesięcznie. Bez karty kredytowej.

Rozpocznij darmowe tłumaczenie

Darmowy plan — 100 000 tokenów miesięcznie. Działa z każdym CMS.

Wielojęzyczność dla headless CMS — Sanity, Contentful i inne — PolyLingo | PolyLingo