Question

CKEditor 4.3 demo显示了使用HTML5 figure标记工作的小部件示例。

作为用户（编辑演示文本）我无法编辑第二个figcaption（一个在图像之前，作为“图标题”，以及其他图像之后，作为标题）：编辑时（通过CKEditor的源代码）之前，它之后，当我在图像之前添加一个段落（p标签）时，也会继续。因此，没有办法用户表达明显的“标题”和“脚标题”，总是CKeditor放在图像之后。

有一些配置可以启用“标题”吗？

已编辑的源代码：

 <figure class="caption" style="float:right">
    <figcaption>HEAD - Test</figcaption>
    <img alt="Apollo-CSM-LM" 
     src="http://b.cksource.com/a/1/img/demo/apollo-csm-lm.png" width="200" />
    <figcaption>FOOT - Apollo CMS-LM spacecraft</figcaption>
 </figure>

所以，CKEditor转换为，

 <figure class="caption" style="float:right">
    <img alt="Apollo-CSM-LM" 
     src="http://b.cksource.com/a/1/img/demo/apollo-csm-lm.png" width="200" />
    <figcaption>HEAD - Test</figcaption>
    <figcaption>FOOT - Apollo CMS-LM spacecraft</figcaption>
 </figure>

同意<p>HEAD - Test</p>。如果我只使用<figcaption>HEAD - Test</figcaption>，它也会在图像之后（不可能表达“在img标题之前”）。

注意-1：“head”和“foot”figcaptions在HTML5中均有效，showed in this fiddle。

注2：另一个问题是带有多个段落的标题。 CKEditor在BR中对其进行转换，这不是作者在典型期刊中所需要的。

注3：针对此相关需求 - 使用段落，使用“前映像”字幕，以及使用两个字幕 - 查看典型期刊的所有需求，如JATS fig element这样的稳定标准，或者PMC上的数百万篇文章示例。

Answer 1

简短回答 - 不，没有配置选项。

一些细节 - 你正在使用image widget，它应该处理figure.caption>img+figcaption个案。特定小部件可能无法用于所有可能的输入，并且在这种情况下会发生。

如果您想删除该限制，有两种方法：

请勿通过停用image widget或从HTML中删除class="caption"来使用image widget。例如，不会更改此HTML：
```
<figure>
    <figcaption>1</figcaption>
    <img src="..." ...>
    <figcaption>2</figcaption>
</figure>
```
此外，回车键将在figcaption s内以标准方式工作（将创建<p>代码）。
另一种方式，如果你想使用widgetDefinition，就是修改它的行为。如果是简单的小部件，可以在不触及小部件代码的情况下完成，widgetDefinition.editables.caption.allowedContent事件监听器。但是，图像小部件非常复杂，因此您必须更改其代码。
- 要更改输入密钥行为，只需更改nested editable - 它必须包含p标记。这部分可以在widgetDefinition监听器中完成。
- 为了能够使用两个字幕，您必须添加另一个plugin code并修改{{3}}，因为它只处理img+figcaption个案例。

CKEditor 4和图小部件，如何表达“标题标题”或两个figcaptions？

1 个答案: