web-dev-qa-db-fra.com

Comment configurer la liste déroulante des styles CkEditor?

J'ai apporté des modifications à la configuration de CKEditor pour l'ensemble de règles basic_html comme suit:

CK Editor configuration

Cependant, lorsque j'essaie d'utiliser l'éditeur, j'obtiens ce qui suit:

Editor as visible on actual page

J'ai essayé de vider le cache plusieurs fois. J'ai essayé de reconstruire le cache avec drush cache-rebuild.

Y a-t-il autre chose que vous êtes censé faire pour pouvoir configurer CKEditor dans Drupal 8?

8wysiwyg
5
tanbog

1. Votre style personnalisé doit être présent dans votre fichier CSS. 2. Votre PARAMÈTRE DE FILTRE devrait être correct. Pour vérifier, de la même manière que la vôtre, je viens d'activer le style et de mettre h1.heading-a|Title (que j'ai pris de css/base/elements.css par exemple à des fins) dans la liste déroulante de style et il est apparu comme indiqué dans la deuxième image.

enter image description here

Deuxième image

enter image description here

Par conséquent, le problème est de mettre correctement le Class|Key dans le Styles dropdown et assurez-vous qu'il est disponible dans CSS.

Plus tard, pour vérifier celui personnalisé, j'ai mis h2.myclass {color: red} dans elements.css et le cache enregistré et effacé. Et comme vous pouvez le voir, il est apparu dans l'image suivante

enter image description here

enter image description here

MISE À JOUR-1: RÉGLAGE DU FILTRE

Maintenant, la raison pour laquelle la ligne horizontale et le soulignement iCon ne sont pas visibles, comme vous l'avez indiqué dans votre commentaire. Pour cela, vous devez vérifier les PARAMÈTRES DU FILTRE. Avez-vous joué avec Limit allow HTML tags and correct faulty HTML liste que vous pouvez voir au bas de la page de configuration HTML de base, comme indiqué dans l'image suivante. Si vous supprimez <hr> dans la liste, l'icône n'apparaîtra pas. Je viens de vérifier, si je supprime <hr> liste de formulaires, l'icône disparaît également.

enter image description here

Et votre paramètre Activer le filtre doit être comme indiqué dans l'image suivante.

enter image description here

7
CodeNext

Pour les personnes sur drupal 8.4: il y a un bogue dans CKEditor lui-même de cette manière. Voir https://www.drupal.org/project/drupal/issues/2911749 = pour plus d'informations et de correctifs.

Une solution de contournement possible consiste à remplacer le ckeditor.js par celui de> Drupal 8.3.7 (devrait être la version 4.6.2), alors tout devrait bien fonctionner à nouveau>.

Dans composer.json, ajoutez ceci à votre section "extra". Voir le commentaire # 33 dans le lien (crédit à @ayalon sur drupal.org):

"patches": {
  "drupal/core": {
    "Downgrade CkEditor until https://www.drupal.org/node/2911749 is fixed": "https://www.drupal.org/files/issues/fix_ckeditor_styles_dropdown-2911749-17.patch"
  }
}
2
Stef Van Looveren

J'ai rencontré un problème similaire lors de l'utilisation du format de texte HTML de base et je voulais ajouter un style comme p.class|Title. La différence était que je ne pouvais même pas ouvrir la liste des styles, car le bouton de style était désactivé.

Pour résoudre ce problème, j'ai modifié le format du texte et ajouté <p class=""> au champ "Limiter les balises HTML autorisées".

1
0711master

Vérifiez si vous avez manqué l'attribut class pour les balises HTML autorisées. Changement

<a href hreflang> <em>

à

<a class href hreflang> <em>
1
Rupesh Jagtap

Dans mon cas, cela n'a pas fonctionné, car la ligne avec une classe CSS spécifique sous "liste déroulante Styles" était trop longue.

Cela marche:

code.c-bolt-code-snippet__code.c-bolt-code-snippet__code--block|Codeblock

mais cela ne fonctionne pas:

code.c-bolt-code-snippet__code.c-bolt-code-snippet__code--block.c-bolt-code-snippet-syntax--light|Codeblock
0
PiotrK