28 avr. 2024 | Connexion

Blog

Intégrer CKEditor dans EasyAdmin

Intégrer CKEditor dans EasyAdmin

Développement web
Symfony PHP

il y a 2 ans citizenz7 4 commentaires 5378 lectures

Installation d'EasyAdmin :

composer req admin


Installation de CKEditor :

composer require friendsofsymfony/ckeditor-bundle


Configuration simple et rapide de CKEditor.
Dans le fichier config/packages/fos_ckeditor.yaml :

fos_ck_editor:
    configs:
        main_config:
            toolbar: full


"Activation" du dashboard d'EasyAdmin :

php bin/console make:admin:dashboard


Dès maintenant vous aurez un nouveau dossier dans src/Controller/Admin avec un fichier DashboardController.php

Vous pourrez également créer des CRUD avec la commande :

php bin/console make:admin:crud


Dans ces CRUD, vous pourrez désormais utiliser ->setFormType(CKEditorType::class) pour "activer" CKEditor sur les champs TextEditorField() :
EXEMPLE :

TextEditorField::new('content')->hideOnIndex()->setFormType(CKEditorType::class),


N'oubliez pas le Use :

use FOS\CKEditorBundle\Form\Type\CKEditorType;


Sous la function configureFields() du CrudController, ajoutez :

public function configureCrud(Crud $crud): Crud
{
  return $crud
      ->addFormTheme('@FOSCKEditor/Form/ckeditor_widget.html.twig');
}


Et voila : CKEDitor est activé dans EasyAdmin !

4 commentaires


Horn, le 13-11-2022 à 15:16:21

Bonjour, Il manque l'installation des assets dans votre procédure. Sinon moi j'ai un pb avec ckeditor lors de la validation du texte ça m'affiche le texte avec toutes les balises... Je suis sur symfony6 et easyAdminBundle

citizenz7, le 13-11-2022 à 16:39:31

@Horn, Salut, Pour les assets : le but n'était pas ici de présenter l'install complète de CKEditor mais sa configuration dans Easyadmin. Pour ce qui est des balises et du texte, c'est normal. CKEditor ajoute des balises HTML type <p>, <div>, etc. Pour l'affichage dans la vue (fichier twig), il faut utiliser le filtre twig |raw Exemple : {{ article.presentation|raw }}

Venkman, le 26-06-2023 à 11:09:16

Bonjour, Merci pour l'article. Pouvez vous nous expliquer comment intégrer la déclaration de CKEditor dans la fonction ConfigureFields svp?

citizenz7, le 01-07-2023 à 16:34:45

@Venkman Il faut ajouter un setFormType() dans configureFields() pour les champs texte : ->setFormType(CKEditorType::class) N'oubliez pas d'ajouter également un addFormTheme dans configureCrud() : ->addFormTheme('@FOSCKEditor/Form/ckeditor_widget.html.twig') ... et n'oubliez pas d'importer le Use : use FOS\CKEditorBundle\Form\Type\CKEditorType;

Nb d'articles actifs : 46 | Nb de commentaires : 33 | Nb de catégories : 8 | Nb de tags : 32 | Nb total de lectures : 189 838
2024 citizenz.info • Some rights reserved GPLv3 • Version 3.3.4

Les 3 actes, c'est les bonnes femmes qui sont mi-taupes mi-déesses, et qui ont forcé les mecs de Bethléem à construire les pyramides. (Kaamelott, Livre III, La poétique, 1ère partie)