Erstellen Sie eine tinyMCE-benutzerdefinierte Schaltfläche, die ein Bootstrap-Modal-Fenster statt der tinyMCE-Vorgabe öffnet

Question

Ich habe erfolgreich eine benutzerdefinierte Schaltfläche erstellt, die ein Popup öffnet, das durch Öffnen des nativen tinyMCE-modalen Fensters funktioniert.

Nach den Anweisungen in dem „Hinzufügen von Popup nach einem Klick auf“ Abschnitt https://www.gavick.com/blog/wordpress-tinymce-custom-buttons#tmce-section-2

Id mögen die elegantere Bootstrap-modalen Fenster stattdessen verwendet hat. Irgendwelche Gedanken oder Vorschläge?

Answer 1

Wie in diesem Artikel beschrieben, können Sie eigene benutzerdefinierte Symbolleistenschaltflächen zu TinyMCE hinzufügen. Anstatt den WindowManager in TinyMCE zu verwenden, rufen Sie Call an, welches JavaScript Sie auch mögen.

Sie würden so etwas in Ihrer init benötigen:

setup: function (editor) { 
    editor.addButton('customButton', { 
     text: 'Custom Button', 
     icon: false, //you can use an image instead of text 
     onclick: function() { 
      // JavaScript code to open your Bootstrap modal 
      // The modal would use TinyMCE APIs to write data back into the editor 
     } 
    }); 
} 

Neben diesem Code müssen Sie auch die folgenden auf Ihre init fügen Sie den Knopf in die Symbolleiste hinzuzufügen:

toolbar2: "... customButton ...",