FOSCKEditorBundle

FOSCKEditorBundle determines the editor's language using a fallback mechanism:

1. Automatic Guessing: The bundle first attempts to guess the language based on the current Symfony request locale.
2. Container Parameter: If the request locale is unavailable, it falls back to the locale container parameter.
3. Default: If neither is available, the editor uses its default language.

You can override this automatic behavior by providing an explicit language configuration.

Plugin dependencies

If a plugin requires other plugins to function, you must install and register those dependencies using the same process (downloading to the web directory and registering via configuration or widget).

Plugin icons

If you are using a built-in or custom toolbar, the plugin icon should appear automatically based on the plugin's own configuration. If you are not using a configured toolbar, you are responsible for manually configuring the icon in your toolbar settings.

The JsonBuilder allows you to construct JSON structures using the Symfony PropertyAccess Component syntax. This provides a way to build complex, nested JSON objects while maintaining control over value escaping.

To use the builder, instantiate it and use setValues or setValue to populate the data, then call build() to generate the final JSON string.

use FOS\CKEditorBundle\Builder\JsonBuilder;

$builder = new JsonBuilder();
$builder->setValues(['foo' => ['bar']]);
$json = $builder->build();

When route parameters depend on the specific object being edited (e.g., a blog post's slug), use the filebrowser*Handler option. This allows you to provide a closure that receives the Symfony RouterInterface to generate a dynamic URL.

This is the most powerful method as it allows the URL generation to be aware of your application's dependencies and the current entity state.

// Example: Generating a route based on a specific post slug
$post = $manager->find($id);

$builder->add('field', 'ckeditor', [
    'config' => [
        'filebrowserBrowseHandler' => function (RouterInterface $router) use ($post) {
            return $router->generate(
                'my_route',
                ['slug' => $post->getSlug()],
                UrlGeneratorInterface::ABSOLUTE_URL
            );
        },
    ],
]);

If you are not using Webpack Encore, you must manually install the downloaded assets into your web directory.

• Symfony <= 2.8: $ php app/console assets:install web
• Symfony >= 3.0 (without Flex): $ php bin/console assets:install web
• Symfony with Flex: $ php bin/console assets:install public

# Symfony with Flex
$ php bin/console assets:install public

When CKEditor transforms a textarea into a widget, the original textarea is no longer updated in real-time, which can cause issues when serializing forms or accessing the field value via JavaScript. You can enable automatic synchronization of the CKEditor content back to the underlying textarea using the input_sync option.

You can enable this globally for all CKEditor instances in your configuration, or specifically for a single field in a Symfony FormBuilder.

# Global configuration in app/config/config.yml
fos_ck_editor:
    input_sync: true

// Per-field configuration in a FormType
$builder->add('field', 'ckeditor', [
    'input_sync' => true
]);

To inject custom JavaScript into all CKEditor widgets, you can override the default Twig template (@FOSCKEditor/Form/ckeditor_widget.html.twig) by overriding the ckeditor_widget_extra block.

1. Create a new template file at app/Resources/views/Form/ckeditor_widget.html.twig.
2. Extend the bundle's default template and implement the ckeditor_widget_extra block with your JavaScript code.
3. Register the template in your Symfony configuration under twig.form_themes to ensure it overrides the default bundle template.

{# app/Resources/views/Form/ckeditor_widget.html.twig #}
{% extends '@FOSCKEditor/Form/ckeditor_widget.html.twig' %}

{% block ckeditor_widget_extra %}
    CKEDITOR.dtd.$removeEmpty['span'] = false;
{% endblock %}

# app/config/config.yml
twig:
    form_themes:
        - "::Form/ckeditor_widget.html.twig"

FOSCKEditorBundle does not automatically handle file browsing or uploading. You must implement the backend logic (controllers/routes) yourself. Once implemented, you must configure the CKEditor instance to point to your URIs or Symfony routes.

CKEditor natively supports the following URI-based options:

• filebrowserBrowseUrl
• filebrowserFlashBrowseUrl
• filebrowserImageBrowseUrl
• filebrowserImageBrowseLinkUrl
• filebrowserUploadUrl
• filebrowserFlashUploadUrl
• filebrowserImageUploadUrl