如何将CKEditor添加到Sonata Admin后端的文本区域

Question

我想将CKEditor添加到Sonata Admin后端。目前，我只运行Create Bundle，它允许我在线编辑内容，但我也想在后端使用编辑器。我尝试了Formatter Widget，但它有点大，因为我不想在实体中创建新字段。

有人已经这样做了吗？

Answer 1

在页面中包含ckeditor脚本，并将ckeditor类添加到文本区域，仅此而已。

示例：在您的表单类型中：

$builder->add('description', 'textarea', array('attr' => array('class' => 'ckeditor')))

在你的树枝上：

   <script src="{{ asset('js/ckeditor.js') }}"></script>
     .
     .
     .
    {{form(form)}}

Answer 2

zizoujab的解决方案是完全正确的，所以我投了赞成票。但是，由于我的问题涉及SonataAdminBundle，还需要做更多的工作。这就是我给出这个额外答案的原因。

我通过覆盖自定义捆绑包中的SonataAdminBundle:CRUD:edit.html.twig解决了这个问题：

{% extends 'SonataAdminBundle:CRUD:base_edit.html.twig' %}
{% block javascripts %}
{{ parent() }}
<script src="{{ asset('js/ckeditor/adapter/jquery.js') }}" type="text/javascript"></script>
    <script src="{{ asset('js/ckeditor/ckeditor.js') }}" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $('textarea.ckeditor').ckeditor();
        });
    </script>
{% endblock %}

此外，我也遇到了问题，因为我使用的是ckeditor版本，所以这不起作用。我无法使用一个，CmfCreateBundle安装。这产生了一些js错误，<textarea>标签消失了。因此，我不得不从ckeditor.com下载"标准"版本，这很有效。

Answer 3

如果你想要一些所见即所得的编辑器，并且可以使用NOT CKEditor，-那么我建议你看一个sonata格式化程序捆绑包

Answer 4

跟随Sonata Formatter的更新文档

配置yml:

twig:
    debug:            "%kernel.debug%"
    strict_variables: "%kernel.debug%"
    # These 3 lines below were missing in my own conf
    # Adding them made formatter richtext editor alternatives
    # finally available in my project:
    form:
        resources:
            - 'SonataFormatterBundle:Form:formatter.html.twig'

奏鸣曲.yml

sonata_block:
    (...)
    blocks:
        (...)
        sonata.block.service.text:
        sonata.page.block.children_pages:
        sonata.formatter.block.formatter:
(...)
sonata_formatter:
    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
    ckeditor:
        templates:
            browser: 'SonataFormatterBundle:Ckeditor:browser.html.twig'
            upload: 'SonataFormatterBundle:Ckeditor:upload.html.twig'