Symfony with Sonata Admin Bundle 和丰富的 HTML 编辑器

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 class:

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 中的富文本编辑器需要一些 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 %}

Symfony with Sonata Admin Bundle 和丰富的 HTML 编辑器

Symfony with Sonata Admin Bundle and rich HTML editor

php

symfony

sonata-admin

sonata