it-swarm-id.com

Apakah ada cara untuk mendapatkan N jumlah editor WYSIWYG dalam jenis posting khusus?

Apakah ada cara untuk memiliki beberapa editor WYSIWYG untuk jenis posting khusus? Misalnya, jika saya memiliki tata letak 2 kolom saya ingin memiliki satu editor untuk satu kolom dan editor lain untuk yang lain.

27
Paul Sheldrake

Katakanlah jenis pos kustom Anda disebut Properties, Anda akan menambahkan kotak untuk menahan editor tinyMCE tambahan Anda menggunakan kode yang mirip dengan ini:

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 adalah ID yang akan diterapkan kotak meta itu, Second Column adalah judul yang akan dimiliki oleh kotak meta, second_column_box adalah fungsi yang akan mencetak HTML untuk kotak meta, properties adalah jenis pos kiriman kami, normal adalah lokasi kotak meta, dan high menentukan bahwa itu harus ditampilkan setinggi mungkin di halaman. (Biasanya di bawah editor tinyMCE default).

Kemudian, dengan mengambil ini sebagai contoh paling dasar, Anda harus melampirkan editor tinyMCE ke sebuah textarea. Kami masih harus mendefinisikan fungsi second_column_box kami yang akan mencetak HTML untuk kotak meta jadi ini adalah tempat yang baik untuk melakukan hal ini:

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

Ada beberapa masalah yang saya tidak yakin bagaimana cara mengatasinya. Editor tinyMCE akan bersarang di dalam kotak metabox, yang mungkin tidak ideal, dan itu tidak akan menampilkan kemampuan untuk beralih antara mode pengeditan HTML dan Visual, serta perintah penyisipan media yang dimiliki oleh editor pos biasa. Beralih mode tampaknya didefinisikan sebagai fungsi yang argumen pertama adalah ID, tetapi juga tampaknya dikodekan ke skrip wp-tinymce. Dimungkinkan untuk menggunakan fungsi built in tinyMCE untuk melakukannya, tetapi ini mengubah textarea antara tinyMCE penuh dan textarea dasar, tanpa tombol penyisipan HTML WP.

20
nobody

Pertama: Terima kasih to @Thomas McDonald untuk jawabannya ; Saya perlu mencari tahu pertanyaan yang persis sama yang ditanyakan @Paul Sheldrakedan kode Thomas membuat saya mulai ke arah yang benar.

Sayangnya saya kemudian macet karena Saya perlu mengubah tata letak dari default ke tata letak yang lebih sederhana dan lebih kecil karena saya perlu menggunakan TinyMCE di metabox samping. Saya mencari praktis di mana-mana untuk mencari solusi dan terutama pada MoxieCode TinyMCE Wiki dan TinyMCE Tips & Cara Forum dan tidak menemukan apa pun! 1 Semua yang saya temukan menjelaskan cara mengatur theme, width, height, dll. Menggunakan tinyMCE.init({...}) tetapi ternyata Anda tidak dapat menggunakannya saat menggunakan tinyMCE.execCommand("mceAddControl").

Saya hampir bingung ketika saya menemukan artikel beberapa instance TinyMCE 3 pada satu halaman oleh Hamilton Chua , dan dia berhasil! Solusinya adalah menetapkan tinyMCE.settings sebelum memanggil tinyMCE.execCommand("mceAddControl"), misalnya:

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

Bagian yang menyedihkan adalah ini benar-benar tidak sulit, tetapi tidak didokumentasikan di tempat lain yang bisa saya temukan. Sungguh menakjubkan menemukan hampir tidak ada orang lain yang mengalami masalah ini.

Jadi, bagaimanapun, kode di atas menghasilkan TinyMCE kedua berikut persis format/tata letak yang dibutuhkan klien saya:

 Multiple TinyMCE TextAreas in the WordPress 3.0 Admin Editor 
(sumber: mikeschinkel.com )

Jadi jika Anda menggunakan @Thomas McDonald kode di atas Anda merasa perlu memodifikasi tata letak pastikan untuk memeriksa artikel Hamilton Chua yang mengagumkan (terima kasih Ham!)}:

P.S.Jika Anda melakukan sesuatu yang sedikit salah, TinyMCE mungkin tidak muncul sama sekali. Sebagai contoh dalam kasus saya, saya menggunakan theme: "simple" pada awalnya dan saya tidak mendapatkan apa-apa dan butuh lebih dari satu jam untuk menyadari bahwa saya hanya perlu menggunakan theme: "advanced". Jadi jika Anda menemukan TinyMCE tidak berfungsi untuk Anda, pastikan untuk mencoba mengubah keadaan, Anda mungkin mengalami masalah yang sama. (BTW, saya belum mencoba tema lain atau menjelajahi apa lagi yang tersedia; jika Anda menemukan tema lain yang berfungsi silakan beri komentar di bawah ini.)

Catatan kaki

1 : Sangat menyebalkan! Setelah lebih dari sebulan dengan WordPress Answer. Saya sekarang berharap untuk menemukan jawaban atas semua pertanyaan saya dengan tingkat kualitas yang sama seperti di sini, dan di tempat lain saya biasanya menemukan kekecewaan!

18
MikeSchinkel

Karena saya menemukan artikel ini sebagai hasil pertama di Google, saya hanya ingin berkomentar bahwa WP sekarang menawarkan fungsi untuk menangani tugas semacam ini.

Dalam fungsi add_meta_box, tambahkan kode berikut ->

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

Di mana pun Anda ingin menambahkan editor TinyMCE

Referensi: wp_editor

1
ejhost

Saya mendapatkannya hanya dengan menambahkan "theEditor" sebagai atribut kelas ke 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>

Editor default, tinymce, diambil oleh fungsi di wp-admin/include/post.php disebut wp_tiny_mce (); Lihat di sumber di baris 1350. Ada array pengaturan di baris 1478. Salah satu opsi tampaknya menunjuk pemilih textarea untuk menerapkan editor javascript. Saya sedang membaca posting ini oleh Keighl di blognya yang mengarahkan saya ke sana. Baca artikel, dan mungkin ada cara untuk memanggil wp_tiny_mce () di plugin bagian admin dan menerapkannya ke area teks kedua yang Anda buat.

0
kevtrout