设置 UI 语言

您可以更改编辑器 UI 的语言。除了 41 种完全翻译的语言（包括 38 种专业翻译），还有许多其他语言由社区翻译人员涵盖。

# 演示

查看编辑器的西班牙语演示

# 从右到左 (RTL) 语言支持

CKEditor 5 原生支持从右到左的语言。当使用 RTL 语言之一时，WYSIWYG 编辑器会调整其 UI 以提供最佳编辑体验，例如镜像工具栏、下拉菜单、按钮等各种元素。

# 演示

查看编辑器的阿拉伯语演示

我们尽力为用户提供最佳的 RTL 支持，并且不断改进编辑器。请查看 GitHub 上的 RTL 支持 问题，以了解更多信息并保持最新。您的反馈意见非常宝贵！

# 从 npm 或 CDN 加载其他语言

默认情况下，编辑器将以美式英语显示。这是内置于 ckeditor.js 文件中的语言。要更改编辑器 UI 的语言，您需要加载其他语言文件。请查看以下部分以了解如何操作。

• npm
• CDN

# npm

从 npm 安装编辑器后，可以从 ckeditor5/translations/[lang].js 导入翻译，并且必须传递给编辑器配置。

例如，要使用波兰语，请导入 'ckeditor5/translations/pl.js' 并将翻译对象传递给编辑器配置。请注意，如果您使用的是高级功能，则需要从相应的包中单独导入其翻译。

import { ClassicEditor, Essentials, Paragraph } from 'ckeditor5';
import { TableOfContents } from 'ckeditor5-premium-features';

import coreTranslations from 'ckeditor5/translations/pl.js';
import premiumFeaturesTranslations from 'ckeditor5-premium-features/translations/pl.js';

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        plugins: [
            Essentials,
            Paragraph,
            TableOfContents
        ],
        toolbar: {
            items: [ 'undo', 'redo', 'tableOfContents' ]
        },
        translations: [
            coreTranslations,
            premiumFeaturesTranslations
        ]
    } )
    .then( /* ... */ )
    .catch( /* ... */ );

有关更多信息，请参阅 npm 安装指南。

# CDN

要使用与默认语言（英语）不同的语言，您需要将编辑器与首选语言一起加载。例如

<link rel="stylesheet" href="https://cdn.ckeditor.com/ckeditor5/43.3.0/ckeditor5.css">
<link rel="stylesheet" href="https://cdn.ckeditor.com/ckeditor5-premium-features/43.3.0/ckeditor5-premium-features.css">

<script type="importmap">
{
    "imports": {
        "ckeditor5": "https://cdn.ckeditor.com/ckeditor5/43.3.0/ckeditor5.js",
        "ckeditor5/": "https://cdn.ckeditor.com/ckeditor5/43.3.0/",
        "ckeditor5-premium-features": "https://cdn.ckeditor.com/ckeditor5-premium-features/43.3.0/ckeditor5-premium-features.js",
        "ckeditor5-premium-features/": "https://cdn.ckeditor.com/ckeditor5-premium-features/43.3.0/"
    }
}
</script>
<script type="module">
import { ClassicEditor, Essentials, Paragraph } from 'ckeditor5';
import { TableOfContents } from 'ckeditor5-premium-features';

import coreTranslations from 'ckeditor5/translations/pl.js';
import premiumFeaturesTranslations from 'ckeditor5-premium-features/translations/pl.js';

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        plugins: [
            Essentials,
            Paragraph,
            TableOfContents
        ],
        toolbar: {
            items: [ 'undo', 'redo' 'tableOfContents' ]
        },
        translations: [
            coreTranslations,
            premiumFeaturesTranslations
        ]
    } )
    .then( /* ... */ )
    .catch( /* ... */ );
</script>

有关更多信息，请参阅 CDN 安装指南。

# 设置内容语言

在 CKEditor 5 中，您可以分别配置 UI 的语言和内容的语言。这意味着您可以使用编辑器的英语 UI，但可以用阿拉伯语或希伯来语键入内容。内容语言会影响编辑体验，例如它会影响屏幕阅读器和拼写检查器。它对于键入某些语言（如 从右到左 语言）也很有用，因为它会更改文本的默认对齐方式。

配置 config.language 以更改内容的语言。在此示例中，编辑器的 UI 将为英语，但内容将为阿拉伯语

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        language: {
            // The UI will be English.
            ui: 'en',

            // But the content will be edited in Arabic.
            content: 'ar'
        }
    } )
    .then( editor => {
        window.editor = editor;
    } )
    .catch( err => {
        console.error( err.stack );
    } );

# 演示

# 可用专业翻译列表

阿拉伯语	孟加拉语	保加利亚语	加泰罗尼亚语
中文（中国大陆）	中文（台湾）	捷克语	丹麦语
荷兰语	英语（美式）	爱沙尼亚语	芬兰语
法语	德语	希腊语	希伯来语
印地语	匈牙利语	印度尼西亚语	意大利语
日语	韩语	拉脱维亚语	立陶宛语
马来语	挪威语	波兰语	葡萄牙语（巴西）
葡萄牙语	罗马尼亚语	俄语	塞尔维亚语
斯洛伐克语	西班牙语	瑞典语	泰语
土耳其语	乌克兰语	越南语

社区翻译还提供澳大利亚和英国英语的变体以及其他各种语言的翻译。

# 相关功能

其他功能可以帮助您控制内容语言

• 文本部分语言 – 设置选定内容部分的语言以支持多语言文本。