หลายภาษาสำหรับ headless CMS.
Polylang มอบเวิร์กโฟลว์หลายภาษาแบบครบวงจรให้กับเว็บไซต์ WordPress PolyLingo นำเวิร์กโฟลว์นั้นสู่ Sanity, Contentful, Webflow, Framer และ headless CMS อื่น ๆ ทุกตัว — ผ่าน REST API ที่ผสานรวมได้ในช่วงบ่ายเดียว
หลายภาษาใน headless CMS เป็นปัญหาที่ยังไม่แก้ไข
Sanity มีปลั๊กอินสำหรับการทำให้เป็นสากล Contentful มี locales แต่ไม่มีตัวใดแปลเนื้อหาของคุณ — พวกเขาเพียงแค่เก็บไว้ในหลายภาษา การเติมช่องภาษานั้นยังคงเป็นกระบวนการด้วยมือ ส่งออกเนื้อหาอังกฤษ ใช้เครื่องมือแปลที่อาจทำลายโครงสร้าง rich text หรือ JSON แก้ไขผลลัพธ์ นำเข้ากลับ ทำซ้ำสำหรับทุกภาษา สำหรับทีมเนื้อหาที่เผยแพร่เป็นประจำ เวิร์กโฟลว์นี้ไม่สามารถขยายได้ และยังไม่มีสำหรับการตั้งค่าส่วนใหญ่ที่เล็กกว่า ซึ่งหมายความว่าเนื้อหาเหล่านั้นจะไม่ถูกแปลเลย
สถาปัตยกรรม headless CMS แยกการจัดการเนื้อหาออกจากการส่งมอบเนื้อหา ซึ่งดีสำหรับความยืดหยุ่น แต่สร้างช่องว่าง: CMS เก็บตัวแปรภาษาไว้ แต่ไม่มีอะไรเติมตัวแปรภาษานั้นด้วยเนื้อหาที่แปล คุณต้องสร้างชั้นนั้นเอง
ทีมส่วนใหญ่จบลงในสองสถานการณ์: แปลเนื้อหาด้วยมือโดยคัดลอกไปยัง DeepL แล้ววางกลับ (ช้า มีข้อผิดพลาด และไม่สามารถขยายได้) หรือเขียนการผสานรวมที่กำหนดเองกับ API การแปลที่ต้องดูแลรักษาตลอดไป ไม่มีตัวเลือกใดที่ดี PolyLingo เป็นทางเลือกที่สะอาดและที่สาม
PolyLingo คือชั้นการแปลที่ CMS ของคุณขาดหายไป
PolyLingo ผสานรวมโดยตรงกับเวิร์กโฟลว์การเผยแพร่ของ CMS ของคุณ ตั้งค่า webhook ที่ทำงานเมื่อเนื้อหาถูกเผยแพร่ ส่งเนื้อหาไปยัง PolyLingo รับเวอร์ชันแปลสำหรับทุกภาษา เขียนกลับไปยัง CMS ของคุณ สำหรับ Sanity นี่คือโค้ดไม่กี่บรรทัดใน server action สำหรับ Contentful คือ webhook handler สำหรับการตั้งค่าที่กำหนดเองคือการเรียก HTTP โมเดลการแปลเข้าใจรูปแบบเนื้อหาของคุณ — Markdown, HTML, JSON, rich text — และรักษาโครงสร้างตลอดเวลา
รูปแบบนี้สอดคล้องกันในทุก CMS: ดึงเนื้อหาในภาษาต้นทาง เรียก PolyLingo API พร้อมภาษาปลายทางทั้งหมด เขียนเนื้อหาที่แปลกลับไปยัง CMS ผ่าน API การจัดการ ทำงานเป็นสคริปต์เวลาสร้างงาน CI หรือ webhook handler — ตามที่เหมาะกับเวิร์กโฟลว์ของคุณ
PolyLingo รองรับ Markdown, HTML และข้อความธรรมดา จึงทำงานกับรูปแบบใด ๆ ที่ CMS ของคุณใช้สำหรับเนื้อหารวย ฟิลด์ที่มีโครงสร้าง (หัวข้อ เนื้อหา ย่อหน้า) สามารถแปลแยกกันเพื่อให้คุณควบคุมได้ละเอียดว่าฟิลด์ใดจะแปล
Sanity + PolyLingo
ปลั๊กอิน Document Internationalization ของ Sanity สร้างเอกสารเชื่อมโยงตาม locale สคริปต์ด้านล่างดึงเอกสารฐานภาษาอังกฤษและสร้างตัวแปรแปลสำหรับแต่ละภาษาปลายทางโดยอัตโนมัติ
ใช้งานได้กับรูปแบบ i18n ระดับเอกสาร (เอกสารหนึ่งฉบับต่อ locale) และรูปแบบระดับฟิลด์ (ทุก locale ในเอกสารเดียว) สำหรับรูปแบบระดับฟิลด์ ให้วนลูปผ่านฟิลด์แทนเอกสาร
// 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 เก็บตัวแปร locale เป็นฟิลด์ในรายการเดียวกัน สคริปต์ด้านล่างใช้ Contentful Management API ดึงรายการภาษาอังกฤษ แปล และเขียนเนื้อหาที่แปลกลับไปยังฟิลด์เฉพาะ locale โดยตรง — ไม่ต้องคัดลอกวางด้วยมือ
Contentful ใช้รหัส locale BCP 47 (เช่น es-ES แทน es) ให้แมปรหัส ISO 639-1 ของ PolyLingo กับการตั้งค่า locale ของ Contentful ตามนั้น
// 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
Localization API ของ Webflow (มีในแผน CMS และ Business) รองรับเนื้อหาฟิลด์เฉพาะ locale สคริปต์ด้านล่างดึงรายการคอลเลกชัน CMS แปลฟิลด์เนื้อหา HTML และเขียนการแปลกลับไปยังตัวแปร locale แต่ละตัวผ่าน Webflow v2 API
Webflow เก็บฟิลด์ rich text เป็น HTML การแปล HTML ของ PolyLingo รักษา markup ที่สร้างโดย Webflow ทั้งหมด — คลาสที่กำหนดเอง แอตทริบิวต์ และองค์ประกอบฝัง — โดยไม่ถูกแตะต้อง
// 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 } }) }
)
}
}สิ่งที่ PolyLingo มอบให้ผู้ใช้ headless CMS
- ✓Sanity — แปลเมื่อเผยแพร่ผ่าน webhook เขียนกลับไปยัง locales ของเอกสาร
- ✓Contentful — แปลรายการโดยอัตโนมัติเมื่อ locale ภาษาอังกฤษถูกอัปเดต
- ✓Webflow — แปลรายการคอลเลกชัน CMS ผ่าน API
- ✓Headless CMS ใด ๆ ที่มี API — รูปแบบการผสานรวมเหมือนกัน
- ✓รักษา rich text, Markdown และ HTML อย่างถูกต้อง
- ✓ทุก 43 ภาษาในคำขอเดียว — ไม่มีการเรียกต่อภาษา
- ✓ใช้งานได้กับ CMS ใด ๆ ที่มี API การจัดการ
- ✓เนื้อหาสามารถแปลซ้ำได้ทุกครั้งที่เผยแพร่ — ไม่มีการซิงค์ด้วยมือ
เวิร์กโฟลว์ CMS หลายภาษาแบบมาตรฐาน
เขียนเนื้อหาในภาษาต้นทางของคุณ
สร้างและเผยแพร่เนื้อหาเป็นภาษาอังกฤษ (หรือภาษาต้นทางของคุณ) CMS ของคุณเก็บเป็นเวอร์ชันที่เป็นทางการ คุณไม่จำเป็นต้องเปลี่ยนเวิร์กโฟลว์การแก้ไขเลย
เรียกใช้สคริปต์แปล
รันสคริปต์ด้วยมือ ตามกำหนดเวลา หรือผ่าน webhook ที่ทำงานเมื่อเนื้อหาถูกเผยแพร่ใน CMS สคริปต์เรียก PolyLingo ครั้งเดียวต่อเอกสารพร้อมภาษาปลายทางทั้งหมด จากนั้นเขียนการแปลทั้งหมดกลับไปยัง CMS ในครั้งเดียว
ปรับใช้ — เนื้อหาที่แปลพร้อมใช้งาน
ส่วนหน้าอ่านเนื้อหาตาม locale จาก CMS ตามปกติ ไม่ต้องเปลี่ยนโค้ดส่วนหน้า เนื้อหาที่แปลจะแสดงในภาษาที่ถูกต้องสำหรับแต่ละเส้นทาง locale
สร้างขึ้นสำหรับใคร
ทีมเนื้อหาบน Sanity หรือ Contentful
บรรณาธิการของคุณเผยแพร่เป็นภาษาอังกฤษ เนื้อหาที่แปลจะปรากฏในทุก locale โดยอัตโนมัติ โดยไม่ต้องให้ทีมแก้ไขใช้เครื่องมือแปล
เอเจนซี่ที่สร้างเว็บไซต์หลายภาษา
ทุกเว็บไซต์ลูกค้าที่คุณสร้างต้องการรองรับหลายภาษา PolyLingo มอบการผสานรวมที่ใช้ซ้ำได้และเรียกเก็บเงินได้ที่ทำงานกับ headless CMS ใด ๆ ในสแตกของคุณ
อีคอมเมิร์ซที่มีเนื้อหาผลิตภัณฑ์ท้องถิ่น
คำอธิบายสินค้า หน้าแคตตาล็อก และเนื้อหาบล็อก — แปลโดยอัตโนมัติเมื่อเผยแพร่ รวมกับราคาตาม locale เพื่อมอบประสบการณ์ช็อปปิ้งที่แปลท้องถิ่นอย่างเต็มที่
คำถามที่พบบ่อยเกี่ยวกับหลายภาษาใน headless CMS
PolyLingo ใช้งานกับ CMS ที่ไม่ได้ระบุไว้ที่นี่ได้ไหม?
ได้ CMS ใด ๆ ที่มี API การจัดการสามารถผสานรวมโดยใช้รูปแบบเดียวกัน — ดึงเนื้อหา เรียก PolyLingo เขียนกลับ Prismic, Storyblok, DatoCMS, Strapi, Ghost และ Directus มี API การจัดการและทำงานกับวิธีนี้ ตัวอย่างการผสานรวมสำหรับ Sanity, Contentful และ Webflow ข้างต้นแสดงรูปแบบนี้
ฉันแปล rich text ที่มีรูปภาพและลิงก์ฝังได้ไหม?
ได้ การแปล HTML รักษาองค์ประกอบฝังทั้งหมดรวมถึงรูปภาพ (จัดการ src และ alt อย่างถูกต้อง) ลิงก์ (รักษา href แปลข้อความลิงก์) และ iframe ข้อยกเว้นเดียวคือเนื้อหาที่ระบุว่าไม่แปล — เช่น บล็อกโค้ดจะไม่ถูกแปลเลย
ฉันจัดการเนื้อหาที่ไม่ควรแปลอย่างไร?
สำหรับเนื้อหาที่มีโครงสร้างที่มีฟิลด์ไม่แปล (เช่น slug, วันที่, ตัวระบุทางเทคนิค) ให้ส่งเฉพาะฟิลด์ที่ต้องการแปล สำหรับ rich text ที่มีส่วนผสมของส่วนที่แปลและไม่แปล ให้ใช้รูปแบบ HTML — PolyLingo จะแปลเนื้อหาข้อความในขณะที่รักษาบล็อกโค้ดและองค์ประกอบโครงสร้างอื่น ๆ โดยอัตโนมัติ
ถ้า CMS ของฉันมีเนื้อหาซ้อนกันล่ะ?
สำหรับเนื้อหาซ้อนลึก (เอกสารที่อ้างอิงเอกสารอื่น) ให้แปลแต่ละประเภทเอกสารแยกกัน เพื่อหลีกเลี่ยงการอ้างอิงเป็นวงกลมและให้คุณควบคุมได้อย่างชัดเจนว่าเนื้อหาใดจะแปล การอ้างอิงระหว่างเอกสารถูกจัดการโดย CMS — PolyLingo แตะเฉพาะเนื้อหาฟิลด์ ไม่แตะความสัมพันธ์เอกสาร
ฉันจะรักษาการซิงค์การแปลเมื่อเนื้อหาต้นทางเปลี่ยนอย่างไร?
รูปแบบที่แนะนำคือเรียกใช้สคริปต์แปลทุกครั้งที่มีเหตุการณ์เผยแพร่ผ่าน webhook ของ CMS เพื่อให้เนื้อหาที่แปลได้รับการอัปเดตเมื่อใดก็ตามที่ต้นทางเปลี่ยน สำหรับการอัปเดตเนื้อหาที่น้อยลง การรันสคริปต์ตามกำหนดเวลารายคืนหรือก่อนการปรับใช้จริงก็ใช้ได้ดีเช่นกัน
มีวิธีทำเครื่องหมายการแปลว่า "ต้องตรวจสอบ" แทนการเผยแพร่โดยอัตโนมัติไหม?
ขึ้นอยู่กับ CMS ของคุณ Contentful และ Sanity รองรับสถานะร่าง — คุณสามารถเขียนเนื้อหาที่แปลเป็นร่างแทนการเผยแพร่ เพื่อให้มนุษย์ตรวจสอบก่อนที่แต่ละ locale จะออนไลน์ ตัวอย่างสคริปต์ข้างต้นใช้การเผยแพร่/สร้างทันที; ปรับขั้นตอนสุดท้ายเพื่อสร้างร่างแทนสำหรับเวิร์กโฟลว์การตรวจสอบ
คู่มือที่เกี่ยวข้อง
เพิ่มหลายภาษาให้ headless CMS ของคุณวันนี้
ระดับฟรี 50,000 โทเค็นต่อเดือน ไม่ต้องใช้บัตรเครดิต
เริ่มแปลฟรีระดับฟรี — 50,000 โทเค็นต่อเดือน ใช้งานได้กับ CMS ใด ๆ