CKEditor：分页显示指示器

Question

我们确实在旨在生成演示文稿的 SaaS 系统中使用 CKEditor material（想想 Powerpoint，但基本上是在 Web 上）。我们实际上使用 CKEditor 生成 "slides"。

在我们的特定情况下，幻灯片具有确定的高度。高度不会是动态的，我们事先知道在 CKEditor 中输入的文章需要多高（以像素为单位）才能在演示文稿中被截断。

问题：我们想要一种实时显示，比如红线或类似的东西，显示页面何时会中断；这样输入 CKEditor 的用户就会感觉到中断何时会到来（我不是在谈论手动将中断放在那里，只是显示中断何时自然发生）。

我们应该如何解决 CKEditor 的问题？

Answer 1

假设您的幻灯片高度必须为 500 像素。 创建一个空的透明 PNG 图像，宽度为 1px，高度为 500px。将最后 2-3 个像素设为红色。这将指示分页符。 然后，在您的 CKEditor 文件夹中找到 contents.css 并修改 .cke_editable 部分以包含 background-image: url('page_break_indicator.png');，这会将图像添加为水平和垂直重复的背景。 但请注意，当用户创建了 3 张或更多幻灯片，然后修改了一张不是最后一张的幻灯片时，必须根据分页符检查所有其他幻灯片。