指南从 Microsoft Office 粘贴内容

从 Office 粘贴功能允许您从 Microsoft Word 和 Microsoft Excel 粘贴内容并保留其原始结构和格式。这是一个高级的、高级的从 Office 粘贴增强功能。

此高级功能是 生产力包 的一部分。生产力包包含在我们的商业许可证中。如果您有有效的 CKEditor 5 许可证,请联系您的客户经理以查看您的资格。即使某些旧版许可证有效,也不符合资格获得独占生产力包。联系我们 获取更多详细信息。

您也可以注册 CKEditor 高级功能 30 天免费试用 以测试此功能。

还有 基本、开源的从 Office 粘贴 功能,您可以 在本指南的后面 阅读有关这两个功能之间差异的更多信息。

# 演示

使用这些示例文档测试从 Microsoft Office 粘贴

要测试从 Office 粘贴,请下载示例文档并在 Microsoft Office 应用程序中打开它们。然后,复制内容并将其粘贴到下面的编辑器中。

此演示展示了一组有限的功能。访问 功能丰富的编辑器示例 以查看更多实际操作。

# 内容格式支持

从 Office 粘贴增强保留了从 Microsoft Office 应用程序粘贴的富内容。请参见下表中支持的样式和格式的完整列表。

# Microsoft Word

注意:表格中每个组的名称对应于 Word 的“修改样式”用户界面中的类别。如果特定格式是本机支持的(不使用 通用 HTML 支持 功能),则会提供负责格式化的插件名称(括号中)。

基本 **从 Office 粘贴** 功能仅支持通过 Microsoft Word 用户界面引入的内联格式。它不支持 Word 样式。

**从 Office 粘贴增强** 功能支持两者。

格式 从 Office 粘贴 高级功能 从 Office 粘贴增强
原生支持 使用 通用 HTML 支持
字体 字体系列 ✅ 是 ✅ 是 (FontFamily) ✅ 是
字体样式(粗体、斜体) ✅ 是 ✅ 是 (Bold, Italic) ✅ 是
字体大小 ✅ 是 ✅ 是 (FontSize) ✅ 是
文本颜色 ✅ 是 ✅ 是 (FontColor) ✅ 是
下划线 ✅ 是 ✅ 是 (Underline[1] ✅ 是 [1]
高级下划线 ❌ 否 ✅ 是 (Underline[2] ✅ 是 [2]
强调标记 ❌ 否 ❌ 否 ✅ 是
删除线 ✅ 是 ✅ 是 (Strikethrough) ✅ 是
双删除线 ❌ 否 ✅ 是 (Strikethrough[3] ✅ 是 (Strikethrough[3]
上标 ✅ 是 ✅ 是 (Superscript) ✅ 是
下标 ✅ 是 ✅ 是 (Subscript) ✅ 是
小型大写字母 ❌ 否 ❌ 否 ✅ 是
全部大写字母 ❌ 否 ❌ 否 ✅ 是
隐藏 ❌ 否 ❌ 否 ✅ 是
字符缩放 ❌ 否 ❌ 否 ❌ 否
字符间距 ❌ 否 ❌ 否 ✅ 是
高级排版 ❌ 否 ❌ 否 ❌ 否
段落 对齐 ✅ 是 ✅ 是 (Alignment) ✅ 是
左缩进 ✅ 是 ✅ 是 (IndentBlock) ✅ 是
右缩进 ❌ 否 ❌ 否 ✅ 是
段前间距 ❌ 否 ❌ 否 ✅ 是
段后间距 ❌ 否 ❌ 否 ✅ 是
行间距 ❌ 否 ❌ 否 ✅ 是
行间距设置为 ❌ 否 ❌ 否 ✅ 是
相同样式的段落之间不留空格 ❌ 否 ❌ 否 ✅ 是
制表符 对齐 ❌ 否 ✅ 是 [4] ✅ 是 [4]
引导线 ❌ 否 ✅ 是 [4] ✅ 是 [4]
边框和底纹 样式 ❌ 否 ❌ 否 ✅ 是
颜色 ❌ 否 ❌ 否 ✅ 是
宽度 ❌ 否 ❌ 否 ✅ 是
❌ 否 ❌ 否 ✅ 是
从文本 ❌ 否 ❌ 否 ✅ 是
填充 ❌ 否 ❌ 否 ✅ 是
图案样式 ❌ 否 ❌ 否 ✅ 是 [5]
图案颜色 ❌ 否 ❌ 否 ✅ 是
语言 语言 ❌ 否 ✅ 是 (TextPartLanguage) ✅ 是
不要检查拼写 ❌ 否 ❌ 否 ❌ 否
框架 文本环绕 ❌ 否 ❌ 否 ❌ 否
大小 ❌ 否 ❌ 否 ❌ 否
水平 ❌ 否 ❌ 否 ❌ 否
垂直 ❌ 否 ❌ 否 ❌ 否
项目符号和编号 一般 ✅ 是 (List[7] ✅ 是 (List[7] ✅ 是 [7]
  • [1] 下划线颜色被忽略。
  • [2] 粘贴为简单下划线
  • [3] 粘贴为单删除线。
  • [4] 制表符不可交互。
  • [5] 并非所有 Word 边框样式都有 CSS 对应项。
  • [6] 保留整体密度,但图案细节丢失。
  • [7] 部分支持。

# Microsoft Excel

注意: 表格中每个组的名称对应于 Excel “设置单元格格式” 用户界面中的类别。 如果特定格式得到原生支持(无需使用 通用 HTML 支持 功能),则会在括号中提供负责该格式的插件名称。

格式 从 Office 粘贴 高级功能 从 Office 粘贴增强
原生支持 使用 通用 HTML 支持
对齐 水平对齐 ❌ 否 ✅ 是 (TableCellProperties) ✅ 是
垂直对齐 ❌ 否 ✅ 是 (TableCellProperties) ✅ 是
缩进 ❌ 否 ✅ 是 (TableCellProperties) ✅ 是
方向(角度) ❌ 否 ❌ 否 ❌ 否
字体 字体 ❌ 否 ✅ 是 (FontFamily) ✅ 是
样式 ❌ 否 ✅ 是 (Bold, Italic) ✅ 是
大小 ❌ 否 ✅ 是 (FontSize) ✅ 是
下划线 ❌ 否 ✅ 是 (Underline) ✅ 是
高级下划线(如双下划线) ❌ 否 ❌ 否 ❌ 否
颜色 ❌ 否 ✅ 是 (FontColor) ✅ 是
删除线 ❌ 否 ✅ 是 (Strikethrough) ✅ 是
上标 ❌ 否 ✅ 是 (Superscript) ✅ 是
下标 ❌ 否 ✅ 是 (Subscript) ✅ 是
边框 边框颜色 ❌ 否 ✅ 是 (TableCellProperties) ✅ 是
边框宽度 ❌ 否 ✅ 是 (TableCellProperties) ✅ 是
边框样式 ❌ 否 ✅ 是 [1] ✅ 是 [1]
跨单元格边框(对角线) ❌ 否 ❌ 否 ❌ 否
填充 背景 ❌ 否 ✅ 是 (TableCellProperties) ✅ 是
图案颜色 ❌ 否 ✅ 是 (TableCellProperties[2] ✅ 是 [2]
图案样式 ❌ 否 ❌ 否 ❌ 否
  • [1] 并非所有 Excel 边框样式都具有 CSS 对应项。
  • [2] 它将覆盖单元格背景。

# 支持其他办公应用程序

在当前阶段,@ckeditor/ckeditor5-paste-from-office@ckeditor/ckeditor5-paste-from-office-enhanced 包的重点是支持来自 Microsoft Word、Microsoft Excel 和 Google Docs 的内容。 但是,这并不意味着不支持从其他类似应用程序(如 Microsoft PowerPoint)粘贴。

默认情况下,CKEditor 5 将支持从这些应用程序粘贴富文本内容,但某些样式和格式可能会丢失,具体取决于源应用程序。 此外,还可能出现其他小错误。

您可以在 此票证 中找到有关与其他应用程序的兼容性的更多信息。

如果您认为对任何应用程序的支持都需要改进,请在以下问题中添加 👍  和评论

随意为其他类似应用程序打开一个 新的功能请求

# 安装

⚠️ 新的导入路径

版本 42.0.0 开始,我们更改了导入路径的格式。 本指南使用新的、更短的格式。 如果您使用的是旧版本的 CKEditor 5,请参考 旧版设置中的包 指南。

要将从 Office 粘贴增强功能添加到您的编辑器中,您需要安装 基本、开源的从 Office 粘贴、从 Office 粘贴增强功能和 通用 HTML 支持 插件。 GeneralHtmlSupport 插件是可选的,但建议使用以优化粘贴样式的保留和准确性。 了解更多

我们强烈建议您还添加其他编辑器包,以获得尽可能多的对从 Microsoft Office 粘贴的内容的原生支持。 您可以在 专用部分 中了解有关与从 Microsoft Office 粘贴的内容一起开箱即用的编辑器功能的更多信息。 要安装推荐的包,请执行以下命令

PasteFromOfficePasteFromOfficeEnhancedGeneralHtmlSupport 插件添加到您的插件列表以及其他支持从 Microsoft Office 粘贴内容的编辑器功能(BoldItalicFontColorIndent 等)。

import {
    ClassicEditor,
    PasteFromOffice,
    GeneralHtmlSupport,
    Alignment,
    Bold,
    Italic,
    Underline,
    Strikethrough,
    Subscript,
    Superscript,
    FontColor,
    FontBackgroundColor,
    FontFamily,
    FontSize,
    Indent,
    Table,
    TableProperties,
    TableCellProperties,
    TextPartLanguage
} from 'ckeditor5';
import { PasteFromOfficeEnhanced } from 'ckeditor5-premium-features';

// Other imports...

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        plugins: [
            // Load the open-source feature.
            PasteFromOffice,

            // Load the enhanced feature.
            PasteFromOfficeEnhanced,

            // Load the recommended General HTML Support feature.
            GeneralHtmlSupport,

            // Load other recommended editor features.
            Alignment, Bold, Italic, Underline, Strikethrough, Subscript, Superscript,
            FontColor, FontBackgroundColor, FontFamily, FontSize, Indent,
            Table, TableProperties, TableCellProperties,
            TextPartLanguage,

            /* ... */
        ],

        // Provide the licence key (see explanation below).
        licenseKey: '<YOUR_LICENSE_KEY>'

        // See the "Configuration" section below to learn how to configure
        // the editor for the best performance.
        // ...
    } )
    .then( /* ... */ )
    .catch( /* ... */ );

最后,更新配置

# 激活功能

要使用此高级功能,您需要使用正确的凭据激活它。 有关详细信息,请参考 许可证密钥和激活 指南。

# 配置

有关更多技术细节,请查看 插件配置参考

从 Office 粘贴增强功能没有自己的配置。 尽管如此,我们还是强烈建议以某种方式加载和配置其他编辑器功能,以优化粘贴样式的保留和性能

推荐的配置如下

import {
    ClassicEditor,
    PasteFromOffice,
    GeneralHtmlSupport,
    Alignment,
    Bold,
    Italic,
    Underline,
    Strikethrough,
    Subscript,
    Superscript,
    FontColor,
    FontBackgroundColor,
    FontFamily,
    FontSize,
    Indent,
    Table,
    TableProperties,
    TableCellProperties,
    TextPartLanguage
} from 'ckeditor5';
import { PasteFromOfficeEnhanced } from 'ckeditor5-premium-features';

// Other imports...

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        plugins: [
            // Load the open-source feature.
            PasteFromOffice,

            // Load the enhanced feature.
            PasteFromOfficeEnhanced,

            // Load the recommended General HTML Support feature.
            GeneralHtmlSupport,

            // Load other recommended editor features.
            Alignment, Bold, Italic, Underline, Strikethrough, Subscript, Superscript,
            FontColor, FontBackgroundColor, FontFamily, FontSize, Indent,
            Table, TableProperties, TableCellProperties,
            TextPartLanguage,

            /* ... */
        ],

        // Provide the licence key.
        licenseKey: '<YOUR_LICENSE_KEY>',

        // Configuration of the GeneralHtmlSupport plugin to allow extra content into the editor.
        // This configuration will preserve styles and formatting normally unsupported by core editor features.
        htmlSupport: {
            allow: [
                {
                    name: /^.*$/,
                    styles: true,
                    attributes: true,
                    classes: true
                }
            ]
        },

        // Configuration of the FontFamily plugin.
        fontFamily: {
            // Allow all fonts from Microsoft Office documents
            // including those that are unknown to CKEditor.
            supportAllValues: true
        },

        // Configuration of the FontSize plugin.
        fontSize: {
            options: [
                8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22
            ],

            // Allow all font sizes from Microsoft Office documents
            // including those that are unknown to CKEditor.
            supportAllValues: true
        },

        // Add UI buttons and dropdowns for extra editor features if you used the feature set
        // from "Installation" section.
        toolbar: [
            // ...
            'bold', 'italic', 'underline', 'strikethrough', 'superscript', 'subscript',
            '|',
            'alignment', 'outdent', 'indent',
            '|',
            'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor',
            '|',
            'insertTable',
            '|',
            'textPartLanguage',
            // ...
        ],

        // Add UI buttons and dropdowns for extra table features if you used the feature set
        // from "Installation" section.
        table: {
            contentToolbar: [
                'tableColumn', 'tableRow', 'mergeTableCells', '|', 'tableProperties', 'tableCellProperties'
            ]
        },

        // ...
    } )
    .then( /* ... */ )
    .catch( /* ... */ );

# 已知问题

  • 从 Microsoft Excel 粘贴时,存在单元格宽度不正确的问题。 了解更多
  • 从 Microsoft Word 粘贴的标题,如果在样式中配置了普通字体权重,将使用粗体字体进行渲染,这是因为编辑器提供了默认样式表。
  • 从 Microsoft Excel 粘贴的粗体文本,对于某些字体可能偶尔显示为普通文本。
  • 存在一个已知问题,即字体系列、字体大小和文本部分语言值在 CKEditor UI 中显示不正确。 了解更多

CKEditor 5 支持更广泛的粘贴功能,包括