Symfony 与 Sonata Admin Bundle 和丰富的 HTML 编辑器答案

【问题标题】：Symfony with Sonata Admin Bundle and rich HTML editorSymfony 与 Sonata Admin Bundle 和丰富的 HTML 编辑器
【发布时间】：2017-12-11 23:42:35
【问题描述】：

我在 Symfony 2.8 安装中成功配置了 Sonata Admin v3.2 和 Sonata Media Bundle。如您所见，后端工作正常：

我想将 content 属性呈现为富 HTML，因此我遵循了相应的指南：

https://sonata-project.org/bundles/formatter/3-x/doc/reference/formatter_widget.html

我按照指南逐步配置了 SonataFormatterBundle，但该字段未正确呈现。这是我的配置：

#Sonata with Symfony >= 2.6
form_themes:
    - 'SonataFormatterBundle:Form:formatter.html.twig'

sonata_block:
    default_contexts: [cms]
    blocks:
        # Enable the SonataAdminBundle block
        sonata.admin.block.admin_list:
            contexts:   [admin]
        # Your other blocks
        sonata.formatter.block.formatter:

sonata_formatter:
ckeditor:
    templates:
        browser: 'SonataFormatterBundle:Ckeditor:browser.html.twig'
        upload: 'SonataFormatterBundle:Ckeditor:upload.html.twig'
default_formatter: richhtml
formatters:
    markdown:
        service: sonata.formatter.text.markdown
        extensions:
            - sonata.formatter.twig.control_flow
            - sonata.formatter.twig.gist
            - sonata.media.formatter.twig


    text:
        service: sonata.formatter.text.text
        extensions:
            - sonata.formatter.twig.control_flow
            - sonata.formatter.twig.gist
            - sonata.media.formatter.twig


    rawhtml:
        service: sonata.formatter.text.raw
        extensions:
            - sonata.formatter.twig.control_flow
            - sonata.formatter.twig.gist
            - sonata.media.formatter.twig


    richhtml:
        service: sonata.formatter.text.raw
        extensions:
            - sonata.formatter.twig.control_flow
            - sonata.formatter.twig.gist
            - sonata.media.formatter.twig


    twig:
        service: sonata.formatter.text.twigengine
        extensions: [] # Twig formatter cannot have extensions

这是我的PostAdmin 课程：

protected function configureFormFields(FormMapper $formMapper)
{
    $formMapper
        ->add('title')
        ->add('content', 'sonata_simple_formatter_type', array(
            'format' => 'richhtml',
            'ckeditor_context' => 'default', // optional
        ))
        ->add('category')
    ;
}

该页面未显示任何错误，但该字段保持为普通文本区域（请参阅我上面的屏幕截图）。

【问题讨论】：

您是否在布局模板中添加了所需的 Javascript 和 CSS 文件？请参阅sonata-project.org/bundles/formatter/3-x/doc/reference/… 步骤 5.4。 Sonata 管理集成
嘿，谢谢！我从您提供的链接中复制了 html，它有效！可能我是从错误版本的 markitup 中获取代码。如果您写了答案，我会将其标记为已解决。

标签： php symfony sonata-admin sonata

【解决方案1】：

所以，对于那些不研究 cmets 的人：

SonataFormatterBundle 中的富文本编辑器需要一些 Javascript 和样式表才能工作。您需要按照here 的说明将它们添加到您的管理布局模板中。

复制自文档（3.x 版代码）：

{% extends 'SonataAdminBundle::standard_layout.html.twig' %}

{% block stylesheets %}
{{ parent() }}

<link rel="stylesheet" href="{{ asset('bundles/sonataformatter/markitup/skins/sonata/style.css') }}" type="text/css" media="all" />
<link rel="stylesheet" href="{{ asset('bundles/sonataformatter/markitup/sets/markdown/style.css') }}" type="text/css" media="all" />
<link rel="stylesheet" href="{{ asset('bundles/sonataformatter/markitup/sets/html/style.css') }}" type="text/css" media="all" />
<link rel="stylesheet" href="{{ asset('bundles/sonataformatter/markitup/sets/textile/style.css') }}" type="text/css" media="all" />
{% endblock %}

{% block javascripts %}
{{ parent() }}

<script src="{{ asset('bundles/ivoryckeditor/ckeditor.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/sonataformatter/vendor/markitup-markitup/markitup/jquery.markitup.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/sonataformatter/markitup/sets/markdown/set.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/sonataformatter/markitup/sets/html/set.js') }}" type="text/javascript"></script>
<script src="{{ asset('bundles/sonataformatter/markitup/sets/textile/set.js') }}" type="text/javascript"></script>
{% endblock %}

【讨论】：