it-swarm.com.de

Benutzerdefinierte Schaltfläche für CKEditor wird nicht auf der Seite zur Knotenerstellung angezeigt

Ich möchte CKEditor in Drupal 8.) eine einfache benutzerdefinierte Schaltfläche hinzufügen. Bisher habe ich die Anweisungen hier und befolgt. hier , und meine benutzerdefinierte Schaltfläche wird auf der Konfigurationsseite unter Konfiguration> Inhaltserstellung> Textformate und Editoren angezeigt, wo ich sie dem Basic HTML hinzugefügt habe und Vollständiges HTML Voreinstellungen.

my custom button is added to Basic HTML toolbars

Wenn ich jedoch einen neuen Artikel erstellen möchte, wird die Schaltfläche nicht in der Editor-Symbolleiste angezeigt.

my custom button is missing in node creation

Ich kann anhand der JS-Konsolenausgaben überprüfen, ob mein Plugin von CKEditor geladen wird und die Funktion init tatsächlich ausgeführt wird. Die Schaltfläche wird einfach nicht angezeigt. Ich schätze alle Hinweise. Ich habe diese Frage gesehen , bei der jemand ein ähnliches Problem zu haben scheint , aber ich verstehe die akzeptierte Antwort nicht wirklich, da sie spezifisch für CKEditor-Vorlagen zu sein scheint. Meine Frage lautet also: Warum wird meine Schaltfläche auf der Konfigurationsseite angezeigt, nicht jedoch auf der Seite zur Knotenerstellung, obwohl das entsprechende JS ausgeführt wird?

Ich habe keine Hooks in meinem Modul implementiert.

info.yml meines Moduls

name: Glossarion
type: module
description: >
  Some description. I'll think about it later.
core: 8.x
version: 0.1
package: CKEditor
dependencies:
  -ckeditor

. php meines Drupal Plugins

class Glossarion extends PluginBase implements CKEditorPluginInterface, CKEditorPluginButtonsInterface {

public function getDependencies(Editor $editor) { return array(); }
public function getLibraries(Editor $editor) { return array(); }
public function isInternal() { return FALSE; }
public function getConfig(Editor $editor) { return array(); }
public function isEnabled(Editor $editor) { return TRUE; }

public function getFile() {
  return drupal_get_path('module', 'glossarion') . '/js/plugins/glossarion/plugin.js';
}

public function getButtons() {
  return [
    'glossarion' => [
      'label' => t('Insert a Word from Glossarion'),
      'image' => drupal_get_path('module', 'glossarion') . '/js/plugins/glossarion/icons/glossarion-editor-icon.png',
      'command' => 'insertTimestamp'
    ]
  ];
}
}

. js meines CKEditor Plugins

'use strict';

CKEDITOR.plugins.add('glossarion',{
  icons: 'glossarion-editor-icon', // %REMOVE_LINE_CORE%
  init : function( editor ) {
    console.log("Glossarion init is being called");
    editor.addCommand( 'insertTimestamp', {
        exec: function( editor ) {
            var now = new Date();
            editor.insertHtml( 'The current date and time is: <em>' + now.toString() + '</em>' );
        }
    });
    // do I have to add the button here again? Seems to have no effect
    editor.ui.addButton( 'Timestamp', {
        label: 'Insert Timestamp',
        command: 'insertTimestamp',
        toolbar: 'basicstyles,0'
    });
    console.debug(editor);
  }
});
6
Thrakbad

Wenn Ihre Schaltfläche nicht sichtbar ist während der Bearbeitung eines Knotens, aber in der Konfigurationsdatei sichtbar ist, bedeutet dies, dass der Wert, den Sie für die Funktion getButtons () haben, nicht übereinstimmt mit den Werten von plugin.js. Das brachte mich für eine Weile hin und her.

editor.ui.addButton( 'glossarion', {
    label: 'Insert Timestamp',
    command: 'insertTimestamp',
    toolbar: 'basicstyles,0'
});

Vielleicht solltest du auch id im Kommentar für dein Plugin vor dem Unterricht definieren

 /**
 * Defines the "Glossarion" plugin.
 *
 * @CKEditorPlugin(
 *   id = "glossarion",
 *   label = @Translation("Glossarion ")
 * )
 */
class Glossarion extends CKEditorPluginBase {

sie verwenden diese id hier

CKEDITOR.plugins.add('glossarion',{
2
KonchenayaTvar

Siehe die Dokumentation unter https://www.drupal.org/developing/api/8/ckeditor .

Beispiele finden Sie in Drupal 8 core, at:

  • \Drupal\ckeditor_test\Plugin\CKEditorPlugin\Llama
  • \Drupal\ckeditor_test\Plugin\CKEditorPlugin\LlamaButton
  • \Drupal\ckeditor_test\Plugin\CKEditorPlugin\LlamaContextual
  • \Drupal\ckeditor_test\Plugin\CKEditorPlugin\LlamaContextualAndButton

(Dies ist genau die gleiche Antwort, die ich unter https://drupal.stackexchange.com/a/191869/7632 gegeben habe.)


Um genau zu antworten, warum die Schaltfläche nicht angezeigt wird: CKEditors Advanced Content Filter (ACF).

Bitte fügen Sie Ihre Schaltfläche im Textformat "Voll-HTML" zu CKEditor hinzu. Überprüfen Sie, ob es dann angezeigt wird. Die Chancen stehen gut.

Ihr Plugin gibt keine ACF-Metadaten an. ACF stellt sicher, dass CKEditor ein sauberes Markup erzeugt. In "Full HTML" gibt es keine Einschränkungen und keine Garantie für sauberes Markup.

2
Wim Leers