Question

在自定义内容类型（员工）中，我有一个正文字段。

在lib\modules\employees\index.js

addFields: [
   {
        name: 'body',
        label: 'Beskrivelse',
        type: 'area',
        options: {
            widgets: {
                'apostrophe-rich-text': {
                    toolbar: ['Bold', 'Italic', 'Link', 'Unlink']
                }
            }
        }
    }
]

并在lib\modules\employees-widgets\views\widget.html

{{ apos.singleton(piece, 'body', 'apostrophe-rich-text', {
    toolbar: [ 'Bold', 'Italic', 'Link', 'Unlink' ]
    })
}}

直接在页面上编辑显示带有工具栏和预览的富文本字段。但是在管理视图中工具栏显示，但预览根本不起作用。看看下面链接的图像：

It looks like this when editing on the page

It looks like this in the admin view

Answer 1

Apostrophe的管理模式CSS已重置，因此模式中的丰富文本区域不会反映项目级别样式。这是为了防止项目级别样式干扰重要的撇号UI。

您可以随时将这些管理范围添加到项目级别的CSS中，只需知道其范围。

Answer 2

如果有人有同样的问题，Stuarts的回答是正确的（当然）。以下是我在lib\modules\apostrophe-assets\public\css\site.less中添加的内容，以使其适用于我。您可能想要添加更多选项或调整品味：）

.apos-ui {
    .apos-rich-text {
        h1 {
            font-size: 2em;
        }
        h2 {
            font-size: 1.6em;
        }
        h3 {
            font-size: 1.3em;
        }
        h1,
        h2,
        h3 {
            margin: 1em 0;
            font-weight: bold;
        }
        p {
            margin-bottom: 1em;
        }
        a {
            color: darkblue;
        }

        strong,
        b {
            font-weight: bold;
        }
        i,
        em {
            font-style: italic;
        }
    }
}

撇号cms - 富文本预览无法在管理视图

2 个答案: