Personalizzare i pulsanti Quicktags dell'editor HTML per aprire una finestra di dialogo per scegliere le opzioni di inserimento

Question

Personalizzare i pulsanti Quicktags dell'editor HTML per aprire una finestra di dialogo per scegliere le opzioni di inserimento

5 set 2011, 00:42:59

Voti: 9

Sto cercando di aggiungere pulsanti quicktag personalizzati, che mi permettano di visualizzare una finestra di dialogo intermedia prima di inserire il codice.

Situazione

Cliccando un pulsante quicktag si apre una finestra di dialogo o una finestra modale thickbox.
La finestra aperta mostra alcune opzioni sulla classe, ecc. e un pulsante "Inserisci".
Cliccando il pulsante "Inserisci" viene inserito il codice.

Contesto

Per aggiungere un pulsante quicktags, useremmo

edButtons[ edButtonsLength+ ] = new edButton(
    'ed_mybutton' , 'Inserisci pulsante', '<div class="class-name">', '</div>'
);
////
edHTML += '<input type="button" value="Inserisci codice personalizzato" id="ed_my_button" class="ed_button" onclick="edInsertTag( edCanvas, edButtonLength_t + 1)" title="Inserisci codice" />';

Ora come posso bypassare il pulsante per aprire una finestra di dialogo (o modale thickbox) invece?

Posso aggiungere un pulsante senza definirlo, come

edHTML += '<input type="button" value="Inserisci codice personalizzato" id="ed_my_button" class="ed_button" onclick="customFunction()" title="Inserisci codice" />';
// e
var customFunction = function() {
   openURL = '<?php admin_url() ?>admin-ajax.php?action="insertCodeAction&TB_iframe=true';
   tb_show( 'Inserisci codice personalizzato', openURL );
};

Per favore condividi la tua saggezza. Grazie in anticipo.

PS: fare questo con TinyMCE è relativamente facile, mi chiedo come farlo con i quicktags HTML. :)

OpenOne

182

post editor quicktag

Commenti

Non ho alcuna idea su come aggiungere una modale, aprire una finestra di dialogo, ma una soluzione per sostituire il codice da pubblicare come contesto e aggiungere la classe css, forse questo ti aiuta un po'. Puoi trovare il codice qui: https://github.com/bueltge/AddQuicktag/blob/master/js/add-quicktags.dev.js#L150

bueltge

1 giu 2018 12:37:35

Tutte le risposte alla domanda

Commenti

questo non mi sta dando output

Amol Bhandari SJ

25 nov 2019 09:51:13

dean1997 21 · Answer 1 · 2014-04-16T00:38:46Z

Secondo il Codex, non puoi farlo direttamente attraverso l'API. Tuttavia, puoi farlo utilizzando il tuo file quicktags.js come mostrato di seguito.

function sample_load_admin_scripts()
{
  if ( is_admin() ) {
    wp_deregister_script('quicktags');
    wp_register_script('quicktags', ("/percorso/del/tuo/quicktags.js"), false, '', true);
  }
}

if (is_admin()) {
  add_action('init', sample_load_admin_scripts);
}

Poi aggiungi semplicemente Javascript per fare il tuo lavoro. La formattazione è relativamente semplice, ma visto che sai già come fare tutto con TinyMCE non entrerò nei dettagli. Ottieni qui il tuo file quicktags.js personale.

dean1997

21

16 apr 2014 00:38:46