如何在Apostrophe CMS刷新之间将持久性样式应用于富文本小部件

Question

我是Apostrophe的初学者，并试图使我了解一些概念，同时也使自己熟悉Apostrophe的全部功能。

[目前，我正在建立一个营销页面。我有一个这样定义的富文本小部件单例：

{{ apos.singleton(data.page, 'introBlurb', 'apostrophe-rich-text', {
            toolbar: [ 'Styles', 'Bold', 'Italic', 'Link', 'Unlink' ],
            styles: [
            { name: 'H1', element: 'h1' },
            { name: 'H2', element: 'h2' },
            { name: 'H3', element: 'h3' },
            { name: 'H4', element: 'h4' },
            { name: 'P', element: 'p'},
            { name: 'H1 Center', element: 'h1', styles: {'text-align': 'center'} },
            { name: 'H2 Center', element: 'h2', styles: {'text-align': 'center'} },
            { name: 'H3 Center', element: 'h3', styles: {'text-align': 'center'} },
            { name: 'H4 Center', element: 'h4', styles: {'text-align': 'center'} },
            { name: 'P Center', element: 'p', styles: {'text-align': 'center'} },
            { name: 'H1 Right', element: 'h1', styles: {'text-align': 'right'} },
            { name: 'H2 Right', element: 'h2', styles: {'text-align': 'right'} },
            { name: 'H3 Right', element: 'h3', styles: {'text-align': 'right'} },
            { name: 'H4 Right', element: 'h4', styles: {'text-align': 'right'} },
            { name: 'P Right', element: 'p', styles: {'text-align': 'right'} }
            ]
            }) }}

CKEditor会在编辑器下拉列表中正确显示所有可用的文本样式，并且我输入的文本已应用正确的文本对齐方式。例如，在选择“ H1右”时键入，应将文本推到输入框的右边。

但是，刷新后（确保已保存），文本将恢复为左对齐样式。我尝试了以下方法：

• 在“属性：{'class'：'textAlignRight'}”的元素之一内交换“ styles”对象
• 将“！重要”附加到我上面列出的文本对齐样式中
• 从我的主要“ site.less”文件中删除所有文本对齐的CSS
• 在lib / modules / apostrophe-rich-text和lib / modules / apostrophe-rich-text-widgets的index.js文件中重新配置sanitizeHtml...以及以上的任何和所有组合。

以上大部分内容来自https://forum.apostrophecms.org/t/using-styles-with-a-rich-text-widget/115的讨论

由于无法确定这一点，我仅对包含可编辑部分的s应用类，而不是控制文本对齐。当然这不是必须的，因为我希望为站点管理员提供一种使其自己的文本对齐的方式，如果他们认为该文本在中心而不是左边或右边看起来更好，或者您拥有什么。

如果有人有任何建议或可以指出正确的方向，我将不胜感激！

我是Apostrophe的初学者，我试图让我的脑袋缠绕在一些概念上，同时也使自己熟悉Apostrophe可以做的全部事情。目前，我是...

Answer 1

为了防止从网页或应用程序进行的复制和粘贴破坏您网站的布局，Apostrophe会过滤为富文本小部件提交的标记。