在新的文章编辑器中排查图像和视频问题

迁移到新版文章编辑器后，您可能会看到图像和视频出现问题，例如多余空格、无边框或视频无法正确显示。

本文内容包括：

排查图像问题

新版文章编辑器不支持旧版编辑器中使用的基于表格的图像边框。要添加边框，请使用图像样式选项或将自定义 CSS 类应用到图像。

要使用 CSS 类添加图像边框：

在文章中插入图像
添加图像
单击工具栏中的 HTML 按钮以打开源代码编辑器
查找 img 元素以获取来源中图像的。添加 CSS 类名，例如 bordered-image.集 class="bordered-image" 于 img 元素。
保存更改
确保您的帮助中心CSS 包含边框样式。例如：

.bordered-image {
  border: 1px solid #ccc;
  border-radius: 4px;
}

添加嵌入式样式的图像边框：

在这里添加边框样式，例如：

border-radius: 8px; border: 10px solid black;

的 style 属性应类似于

style="aspect-ratio: 1600/1067; border: 10px solid black; border-radius: 8px;"

除非必要，否则请勿在新版文章编辑器中调整图像大小。调整图像大小时，仅更改一个尺寸（宽度或高度），以保持纵横比不变。编辑器会自动缩放另一个维度。
使用外部工具（例如 photoshop、gimp 或在线编辑器）在上传图像之前调整图像大小
使用插入图像按钮，而不是复制粘贴。复制粘贴会添加不需要的 HTML 属性。
将图像默认设置为 100% 宽度：
- 插入图像后，选择该图像，然后使用图像工具栏将宽度设置为 100%
- 如需全局解决方案，请将此 CSS 添加到您的帮助中心主题：

.article-body img {
  width: 100%;
  height: auto;
}

如果通知电邮中的图像看起来失真：
- 从移除宽度和高度 HTML 属性 <img> 工单标签
- 使用 CSS 设置大小，但某些电邮客户端会去除 CSS 属性
- 对于粘贴的图像，请确保编辑器已移除 HTML 属性的宽度和高度，并对大小使用 CSS

这些步骤可解决从旧版文章编辑器迁移到新版文章编辑器后的大多数图像和视频显示问题。它们有助于您的帮助中心文章保持一致、专业的外观。

如果您从旧版编辑器迁移到新版文章编辑器，嵌入视频在帮助中心文章中的显示方式可能会有所不同。本部分介绍了如何正确显示嵌入的视频，尤其是对于自定义嵌入代码或使用非标准视频平台时。

要使嵌入的视频正确显示，请执行以下操作：

新版文章编辑器中的视频嵌入仅支持基于 iFrame 的嵌入代码。其他方法（例如脚本标签、直接链接或自定义 div 标签）不受支持，也不会在编辑器或已发布文章中呈现。

您可以通过两种方式插入嵌入的视频：

单击 插入到文章中> 在工具栏中嵌入
将 iFrame 嵌入代码直接粘贴到文章的源代码中
- 如果您的文章使用的是非 iframe 嵌入，请将其更新为使用来自您的视频提供商的基于 iframe 的嵌入代码
- 如果您已在使用 iFrame，请启用 显示不安全的内容 ，使其无需更新即可呈现每篇文章

新版文章编辑器可能会将嵌入视频默认设置为 100% 宽度。要更改大小，请使用 CSS，而不是 HTML 宽度属性：

.article-body iframe {
  width: 50% !important;
}

注意：请勿在 HTML 编辑器中直接编辑视频宽度。新的文章编辑器可能会覆盖此更改。

如果视频显示为小缩略图或未如预期显示：

有关更多信息，请参阅过渡到新的文章编辑器。

翻译免责声明：本文章使用自动翻译软件翻译，以便您了解基本内容。我们已采取合理措施提供准确翻译，但不保证翻译准确性

如对翻译准确性有任何疑问，请以文章的英语版本为准。