C'è un modo per ottenere N numero di editor WYSIWYG in un tipo di post personalizzato?

Esiste un modo per avere più editor WYSIWYG per un tipo di post personalizzato? Ad esempio, se avessi un layout a 2 colonne, avrei voluto avere un editor per una colonna e un altro editor per l'altra.

PropertiesSupponi che sia stato chiamato il tuo tipo di post personalizzato , aggiungeresti la casella per contenere il tuo editor tinyMCE aggiuntivo usando un codice simile a questo:

function register_meta_boxen() {
    add_meta_box("wysiwyg-editor-2", "Second Column", "second_column_box",
    "properties", "normal", "high");    
}
add_action('admin_menu', 'register_meta_boxen');

wysiwyg-editor-2è l'ID a cui verrà applicato il meta box, Second Columnè il titolo che avrà il meta box, second_column_boxè la funzione che stamperà l'HTML per il meta box, propertiesè il nostro tipo di post personalizzato, normalè la posizione del meta box e highspecifica che dovrebbe essere visualizzato il più in alto possibile nella pagina. (Di solito sotto l'editor di default tinyMCE).

Quindi, prendendo questo come esempio di base, è necessario collegare l'editor tinyMCE a un'area di testo. Dobbiamo ancora definire la nostra second_column_boxfunzione che stamperà l'HTML per la meta-box, quindi questo è un posto buono come un altro per farlo:

function second_column_box() {
    echo <<<EOT
    <script type="text/javascript">
jQuery(document).ready(function() {
    jQuery("#tinymce").addClass("mceEditor");
    if ( typeof( tinyMCE ) == "object" &&
         typeof( tinyMCE.execCommand ) == "function" ) {
        tinyMCE.execCommand("mceAddControl", false, "tinymce");
    }
});
</script>
    <textarea id="tinymce" name="tinymce"></textarea>
EOT;
}

Ci sono un paio di problemi che non sono sicuro di come superare. L'editor tinyMCE verrà annidato all'interno di un metabox, che potrebbe non essere l'ideale, e non presenterà la possibilità di passare tra le modalità di modifica HTML e Visual, nonché i comandi di inserimento multimediale che ha il normale editor di post. Il cambio delle modalità sembra essere definito come una funzione il cui primo argomento è l'ID, ma sembra anche essere codificato nello script wp-tinymce. È possibile utilizzare le funzioni built-in tinyMCE per farlo, ma ciò cambia l'area di testo tra tinyMCE completo e un'area di testo di base, senza alcun pulsante di inserimento HTML WP.

Primo: un grande ringraziamento a @Thomas McDonald per la sua risposta ; Ho dovuto capire esattamente la stessa domanda che @ Paul Sheldrake ha posto e il codice di Thomas mi ha fatto iniziare nella giusta direzione.

Purtroppo poi mi sono bloccato perché avevo bisogno di cambiare il layout dal default a un layout più semplice e più piccolo poiché avevo bisogno di usare TinyMCE in un metabox laterale. Ho cercato praticamente dappertutto una soluzione e soprattutto sul MoxieCode TinyMCE Wiki e TinyMCE Suggerimenti e forum e non ho trovato nulla! ¹ Tutto ho trovato spiegato come impostare theme, width, height, ecc usando tinyMCE.init({...})ma a quanto pare non è possibile utilizzare che quando si utilizza tinyMCE.execCommand("mceAddControl").

Stavo perplesso quando mi sono imbattuto nell'articolo più istanze di TinyMCE 3 su una pagina di Hamilton Chua , e lui l'ha inchiodato! La sua soluzione era quella di assegnare tinyMCE.settingsprima di chiamare tinyMCE.execCommand("mceAddControl"), ad esempio:

<?php 
$id = "sidebar-content";
$script = <<<EOT
<script type="text/javascript">
jQuery(document).ready(function($) {
    $("#{$id}").addClass("mceEditor");
    if ( typeof( tinyMCE ) == "object" &&
         typeof( tinyMCE.execCommand ) == "function" ) {
      tinyMCE.settings = {
        theme : "advanced",
        mode : "none",
        language : "en",
        height:"200",
        width:"100%",
        theme_advanced_layout_manager : "SimpleLayout",
        theme_advanced_toolbar_location : "top",
        theme_advanced_toolbar_align : "left",
        theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull",
        theme_advanced_buttons2 : "",
        theme_advanced_buttons3 : ""
      };
      tinyMCE.execCommand("mceAddControl", true, "{$id}");
    }
});
</script>
<textarea id="sidebar-content" name="sidebar-content"></textarea>
EOT;

La parte triste è che questo non è stato davvero difficile, ma non è stato documentato da nessun'altra parte. È incredibile scoprire che quasi nessun altro ha riscontrato questo problema.

Quindi, comunque, il codice sopra ha generato il seguente secondo TinyMCE esattamente nel formato / layout di cui il mio cliente aveva bisogno:

_{(fonte: mikeschinkel.com )}

Quindi, se stai usando il codice @Thomas McDonald sopra trovi che hai bisogno di modificare il layout, assicurati di dare un'occhiata al fantastico articolo di Hamilton Chua (grazie Ham!) :

• Più istanze di TinyMCE 3 su una pagina

PS Se fai qualcosa di anche leggermente sbagliato, TinyMCE potrebbe non apparire affatto. Ad esempio, nel mio caso usotheme: "simple"inizialmente e non ho ottenuto nulla e mi ci è voluta più di un'ora per capire che avevo solo bisogno di usaretheme: "advanced". Quindi, se scopri che TinyMCE non funziona per te, assicurati di provare a cambiare le cose, potresti avere un problema simile. (A proposito, non ho provato nessun altro tema né esplorato cos'altro è disponibile; se trovi altri temi che funzionano, per favore lascia un commento qui sotto.)

Nota

1 : molto frustrante! Dopo poco più di un mese con WordPress Answer ora mi aspetto di trovare le risposte a tutte le mie domande con lo stesso livello di qualità di qui, e altrove in genere trovo delusione!

Da quando ho trovato questo articolo come primo risultato in Google, volevo solo commentare che WP ora offre una funzione per gestire questo tipo di attività.

All'interno della add_meta_boxfunzione, aggiungi il seguente codice ->

wp_editor( $content, $editor_id, $settings = array() );

Ovunque tu voglia aggiungere l'editor TinyMCE

Riferimento: wp_editor

L'editor predefinito, tinymce, è caricato da una funzione in wp-admin / Includes / post.php chiamata wp_tiny_mce (); Guarda l'origine alla riga 1350. C'è una matrice di impostazioni alla riga 1478. Apparentemente una delle opzioni designa il selettore textarea a cui applicare l'editor javascript. Stavo leggendo questo post di Keighl sul suo blog che mi ha indicato. Leggi l'articolo e forse c'è un modo per chiamare wp_tiny_mce () in un plug-in della sezione admin e applicarlo a una seconda area di testo che crei.

Ho capito semplicemente aggiungendo "theEditor" come attributo di classe in una textarea:

<div style="background: #FFF; border: 1px solid #CCC;"><textarea id="my_details_field" name="my_details" class="theEditor" rows="20" style="width: 100%;"><?=get_post_meta($post->ID, 'my_details', TRUE)?></textarea></div>