使用Sonata Admin Bundle和豐富的HTML編輯器的Symfony

Question

我在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')
    ;
}

該頁面未顯示任何錯誤，但該字段保留為正常的文本區域（請參見上面的屏幕截圖）。

Answer 1

因此，對於那些不關注評論的人：

SonataFormatterBundle中的RTF編輯器需要一些Javascript和樣式表才能工作。 您需要按照此處的說明將這些添加到您的管理布局模板中。

從文檔復制（ 版本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 %}