Come creare finestre di dialogo TinyMCE?

Question

Ok, la risposta a questa domanda sarebbe davvero molto più semplice se potessi trovare le informazioni pertinenti all'interno della documentazione di TinyMCE, ma non posso. Quello che voglio fare è la seguente:

1. utente o seleziona il testo all'interno dell'editor TinyMCE o non scatta
2. utente il pulsante
3. dialogo si apre con il testo selezionato in uno dei tre campi (voglio essere in grado di creare un link bit.ly da un URL completo nell'editor)
4. L'utente fa clic su OK, la magia accade e viene inviata nuovamente all'editor con il contenuto appena modificato.

Quindi, in pratica, tutto ciò di cui ho veramente bisogno è sapere come far funzionare il popup, almeno per ora. Il problema è: la ricerca per "popup di tinymce", "finestra di dialogo di tinimce" "utente di tinymce" non fornisce nulla di utile che io possa vedere.

Answer 1

Il modo più semplice per fare qualcosa di simile è con un plug-in TinyMCE.

Sul sito TinyMCE c'è un tutorial to creating a plugin. Utilizza il plugin esempio che fa parte del pacchetto di download di TinyMCE.

La buona notizia è che il plug-in di esempio prende il testo selezionato e lo visualizza all'interno di una finestra di dialogo. Questo dovrebbe darti un quadro di base su cui costruire.

Answer 2

Le esercitazioni su come creare una finestra di dialogo/prompt in TinyMCE si sono spostate e alcuni degli esempi su come farlo da quando sono spariti. C'è un nuovo tutorial che copre creating plugins and dialogs for TinyMCE 4.

La parte rilevante è:

// Open window 
editor.windowManager.open({ 
    title: 'Example plugin', 
     body: [ 
      {type: 'textbox', name: 'title', label: 'Title'} 
     ], 
     onsubmit: function(e) { 
      // Insert content when the window form is submitted 
      editor.insertContent('Title: ' + e.data.title); 
     } 
});