如何覆盖 TinyMCE 图像右对齐的默认实现？

Question

我正在使用 TinyMCE V5 使我的用户能够编写电子邮件模板。

由于我们处理的是电子邮件模板，因此存在 Outlook 问题。 Outlook 不支持多种样式和元素。

在这里，我专注于以 Outlook 可以理解的方式对齐图像。

TinyMCE对图像对齐的默认实现是：

• 右对齐>将 style="float:right;" 添加到 img 标签
• 以实现居中对齐 >将 style="display:block;margin-left:auto;margin-right:auto;" 添加到 img 标记

Outlook 不支持浮动也不支持自动边距。

有没有办法可以覆盖 TinyMCE 图像对齐的方式？

如果是这样，我会将 text-align:right 添加到 p 标记，并使 img 具有 display:block.

我知道这将导致不可能在同一段落中将两个图像对齐到不同的侧面，我对此表示同意。

Answer 1

我向 Tiny 开了一张支持票，他们很快就找到了解决方案，即使用 formats 选项，如下所示：

tinymce.init({
    selector: "textarea",
    plugins: ["code", "image", "paste"],
    toolbar: "bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | image",
    formats: {
      alignleft: {selector: 'p', styles: {'text-align':'left'}},
      aligncenter: {selector: 'p', styles: {'text-align':'center'}},
      alignright: {selector: 'p', styles: {'text-align':'right'}}
    },
});