zenside/ckeditor-bundle

Replace textarea with CKeditor. Come configured with working Image Upload & Media Embed support.

ZenSide CKEditor Bundle

Replace textarea with CKeditor., _(*1)

Come configured with working Image Upload & Media Embed support, _(*2)

1.Add Bundle to AppKernel

public function registerBundles()
{
    $bundles = array(
        ...
        new ZenSide\CKEditorBundle\ZenSideCKEditorBundle(),
    )
}

2.Add route to routing.yml

zenside_ckeditor:
    resource: "@ZenSideCKEditorBundle/Resources/config/routing.yml"

3.Add initialisation to your layout

{% include 'ZenSideCKEditorBundle::ckeditor_init.html.twig' %}, _(*3)

4.Change selector used (optional)

By default all textarea will be replaced. To filter it you can pass a css selector to the include call :, _(*4)

{% include 'ZenSideCKEditorBundle::ckeditor_init.html.twig' with {'selector':'textarea.ckeditor'} %}, _(*5)

5. Change Stylesheet applied inside editor (optional)

You can overwrite the default styles of the ckeditor by giving your own stylesheet asset path to the init file, _(*6)

{% include 'ZenSideCKEditorBundle::ckeditor_init.html.twig' with {'contentsCss':'bundles/mybundlename/css/myStyleFile.css'} %}, _(*7)

4.File Upload configuration (optional)

By default, files uploaded are moved into /web/uploads/cke. You can change this with parameter ckeditor.upload_dir in parameters.yml. Note that this folder will be relative to /web folder (had to be visible from browser to be included in CKEditor visualisation)., _(*8)

// parameters.yml
parameters:
    ...
    ckeditor.upload_dir = "/myuploaddir"

5.Change CKEditor configuration (optional)

You can import (after previous include) your own config.js file to overide default bundle configuration, _(*9)