Gibt es eine Möglichkeit, N WYSIWYG-Editoren in einem benutzerdefinierten Beitragstyp abzurufen?

Gibt es eine Möglichkeit, mehrere WYSIWYG-Editoren für einen benutzerdefinierten Beitragstyp zu haben? Wenn ich zum Beispiel ein zweispaltiges Layout hätte, hätte ich gerne einen Editor für eine Spalte und einen anderen für die andere.

Angenommen, Ihr benutzerdefinierter Beitragstyp wurde aufgerufen Properties, fügen Sie das Feld für Ihren zusätzlichen tinyMCE-Editor hinzu. Verwenden Sie dazu den folgenden Code:

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-2ist die ID, auf die die Meta-Box angewendet wird, Second Columnist der Titel, den die Meta-Box haben wird, second_column_boxist die Funktion, die den HTML-Code für die Meta-Box ausgibt, propertiesist unser benutzerdefinierter Beitragstyp, normalist der Speicherort der Meta-Box und highgibt an, dass es auf der Seite so hoch wie möglich angezeigt werden soll. (Normalerweise unter dem Standard-tinyMCE-Editor).

Als grundlegendes Beispiel müssen Sie dann den tinyMCE-Editor an ein Textfeld anhängen. Wir müssen noch unsere second_column_boxFunktion definieren , die den HTML-Code für die Meta-Box ausgibt. Dies ist also genau der richtige Ort, um dies zu tun:

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;
}

Es gibt einige Probleme, bei denen ich nicht sicher bin, wie ich sie lösen soll. Der tinyMCE-Editor befindet sich in einer Metabox, die möglicherweise nicht ideal ist, und bietet nicht die Möglichkeit, zwischen dem HTML- und dem visuellen Bearbeitungsmodus zu wechseln, sowie die Befehle zum Einfügen von Medien, über die der normale Post-Editor verfügt. Das Umschalten der Modi scheint als eine Funktion definiert zu sein, deren erstes Argument die ID ist, aber es scheint auch im wp-tinymce-Skript codiert zu sein. Es ist möglich, die eingebauten tinyMCE-Funktionen zu verwenden, dies ändert jedoch den Textbereich zwischen dem vollständigen tinyMCE und einem Basistextbereich ohne die WP-HTML-Einfügungsschaltflächen.

Erstens: Vielen Dank an @Thomas McDonald für seine Antwort ; Ich musste genau die Frage herausfinden , die @Paul Sheldrake gestellt hatte , und der Code von Thomas brachte mich in die richtige Richtung.

Leider blieb ich dann hängen, weil ich das Layout von der Standardeinstellung auf ein einfacheres und kleineres Layout ändern musste, da ich den TinyMCE in einer Neben-Metabox verwenden musste. Ich habe praktisch überall nach einer Lösung gesucht und vor allem im MoxieCode TinyMCE Wiki und im TinyMCE Tips & How To Forum nichts gefunden! ¹ Alles , was ich fand , erklärte , wie Satz theme, width, heightusw. verwendet , tinyMCE.init({...})aber anscheinend kann man nicht verwenden, wenn Sie verwenden tinyMCE.execCommand("mceAddControl").

Ich war fast ratlos, als ich auf einer Seite des Artikels mehrere TinyMCE 3-Instanzen von Hamilton Chua sah , und er hat es geschafft! Seine Lösung war, tinyMCE.settingsvor dem Anruf zuzuweisen tinyMCE.execCommand("mceAddControl"), zum Beispiel:

<?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;

Der traurige Teil ist, dass dies wirklich nicht schwer war, aber es wurde nirgendwo anders dokumentiert, wo ich es finden konnte. Es ist erstaunlich zu entdecken, dass fast niemand dieses Problem erlebt hat.

Der obige Code erzeugte also trotzdem den folgenden zweiten TinyMCE in genau dem Format / Layout, das mein Client benötigte:

_{(Quelle: mikeschinkel.com )}

Wenn Sie also den @Thomas McDonald- Code oben verwenden und feststellen, dass Sie das Layout ändern müssen, lesen Sie unbedingt den großartigen Artikel von Hamilton Chua (danke Ham!) :

• Mehrere TinyMCE 3-Instanzen auf einer Seite

PS Wenn Sie etwas falsch machen, wird der TinyMCE möglicherweise überhaupt nicht angezeigt. Zum Beispiel in meinem Fall, den ich zuerst benutzetheme: "simple"und ich habe nichts bekommen und es hat über eine Stunde gedauert, bis mir klar wurde, dass ich nur benutzen musstetheme: "advanced". Wenn Sie also feststellen, dass TinyMCE nicht für Sie funktioniert, versuchen Sie auf jeden Fall, die Dinge zu ändern. Möglicherweise haben Sie ein ähnliches Problem. (Übrigens habe ich noch keine anderen Themen ausprobiert oder untersucht, was noch verfügbar ist. Wenn Sie andere Themen finden, die funktionieren, lassen Sie bitte einen Kommentar unten.)

Fußnote

1 : Sehr frustrierend! Nach etwas mehr als einem Monat mit WordPress Answer erwarte ich nun, Antworten auf alle meine Fragen in der gleichen Qualität wie hier zu finden, und anderswo stoße ich normalerweise auf Enttäuschung!

Da ich diesen Artikel als erstes Ergebnis in Google gefunden habe, wollte ich nur erwähnen, dass WP jetzt eine Funktion bietet, um diese Art von Aufgabe zu erledigen.

Fügen Sie innerhalb der add_meta_boxFunktion den folgenden Code hinzu ->

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

Überall dort, wo Sie den TinyMCE-Editor hinzufügen möchten

Referenz: wp_editor

Der Standardeditor tinymce wird von einer Funktion namens wp_tiny_mce () in wp-admin / includes / post.php geladen. Schauen Sie in der Quelle in Zeile 1350 nach. Es gibt eine Reihe von Einstellungen in Zeile 1478. Eine der Optionen bestimmt anscheinend den Textbereich-Selektor, auf den der Javascript-Editor angewendet werden soll. Ich habe diesen Beitrag von Keighl auf seinem Blog gelesen , der mich darauf aufmerksam gemacht hat. Lesen Sie den Artikel und vielleicht gibt es eine Möglichkeit, wp_tiny_mce () in einem Administrator-Plug-in aufzurufen und auf einen zweiten von Ihnen erstellten Textbereich anzuwenden.

Ich habe es einfach durch Hinzufügen von "theEditor" als Klassenattribut zu einem Textbereich erhalten:

<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>