123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165 |
- Installation
- ============
- Download the Bundle
- -------------------
- Require the bundle in your ``composer.json`` file:
- .. code-block:: bash
- $ composer require friendsofsymfony/ckeditor-bundle
- Register the Bundle
- -------------------
- If you're using Symfony >= 4.0, skip this step, as it is automatically done by Flex's recipe.
- If you choose to not execute the recipe, and if you're using Symfony >= 4.0, update your ``config/bundles.php``:
- .. code-block:: php
- return [
- // ...
- FOS\CKEditorBundle\FOSCKEditorBundle::class => ['all' => true],
- ];
- If you're using Symfony < 4.0, update your ``app/AppKernel.php``:
- .. code-block:: php
- class AppKernel extends Kernel
- {
- public function registerBundles()
- {
- $bundles = array(
- new FOS\CKEditorBundle\FOSCKEditorBundle(),
- // ...
- );
- // ...
- }
- }
- Download CKEditor
- -----------------
- With bundle's command
- ~~~~~~~~~~~~~~~~~~~~~
- Once, you have registered the bundle, you need to install CKEditor:
- If you're using Symfony <= 2.8:
- .. code-block:: bash
- $ php app/console ckeditor:install
- If you're using Symfony >= 3.0:
- .. code-block:: bash
- $ php bin/console ckeditor:install
- If you want to learn more about this command, you can read :doc:`its documentation <usage/ckeditor>`.
- Using Webpack Encore
- ~~~~~~~~~~~~~~~~~~~~
- If you have installed Webpack Encore, you may want to have it as a `node_module` dependency.
- You can by running this command:
- .. code-block:: bash
- # if you are using NPM as package manager
- $ npm install --save ckeditor@^4.13.0
- # if you are using Yarn as package manager
- $ yarn add ckeditor@^4.13.0
- Once installed, add the following lines to your Webpack Encore configuration file (this excludes the samples directory from the ckeditor node module):
- .. code-block:: javascript
- // webpack.config.js
- var Encore = require('@symfony/webpack-encore');
- Encore
- // ...
- .copyFiles([
- {from: './node_modules/ckeditor4/', to: 'ckeditor/[path][name].[ext]', pattern: /\.(js|css)$/, includeSubdirectories: false},
- {from: './node_modules/ckeditor4/adapters', to: 'ckeditor/adapters/[path][name].[ext]'},
- {from: './node_modules/ckeditor4/lang', to: 'ckeditor/lang/[path][name].[ext]'},
- {from: './node_modules/ckeditor4/plugins', to: 'ckeditor/plugins/[path][name].[ext]'},
- {from: './node_modules/ckeditor4/skins', to: 'ckeditor/skins/[path][name].[ext]'},
- {from: './node_modules/ckeditor4/vendor', to: 'ckeditor/vendor/[path][name].[ext]'}
- ])
- // Uncomment the following line if you are using Webpack Encore <= 0.24
- // .addLoader({test: /\.json$/i, include: [require('path').resolve(__dirname, 'node_modules/ckeditor')], loader: 'raw-loader', type: 'javascript/auto'})
- ;
- Then, override the bundle's configuration to point to the new CKEditor path:
- .. code-block:: yaml
- fos_ck_editor:
- # ...
- base_path: "build/ckeditor"
- js_path: "build/ckeditor/ckeditor.js"
- Finally, run encore command:
- .. code-block:: bash
- # if you are using NPM as package manager
- $ npm run dev
- # if you are using Yarn as package manager
- $ yarn run encore dev
- Install the Assets
- ------------------
- .. note::
- This step is not required if you are using Webpack Encore.
- Once, you have downloaded CKEditor, you need to install it in the web
- directory.
- If you're using Symfony <= 2.8:
- .. code-block:: bash
- $ php app/console assets:install web
- If you're using Symfony >= 3.0 without Symfony Flex:
- .. code-block:: bash
- $ php bin/console assets:install web
- If you're using Symfony Flex:
- .. code-block:: bash
- $ php bin/console assets:install public
- Configure Twig
- --------------
- .. note::
- This step is not required if you installed the bundle using Symfony Flex and the recipe was installed.
- Finally, add some configuration under the ``twig.form_themes`` config key:
- .. code-block:: yaml
- # Symfony 2/3: app/config/config.yml
- # Symfony 4: config/packages/twig.yaml
- twig:
- form_themes:
- - '@FOSCKEditor/Form/ckeditor_widget.html.twig'
|