Чи є спосіб отримати N кількість редакторів WYSIWYG у користувацькому типі публікації?

Чи може бути кілька редакторів WYSIWYG для користувацького типу публікації? Наприклад, якщо у мене був макет 2 стовпців, я хотів мати один редактор для одного стовпця та інший редактор для іншого.

Скажімо, ваш спеціальний тип публікації викликався Properties, ви додасте поле для зберігання вашого додаткового редактора tinyMCE, використовуючи код, подібний до цього:

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це ідентифікатор, який мета-вікно застосує до нього, Second Columnце заголовок, який буде мати мета-вікно, second_column_boxце функція, яка роздруковує HTML для мета-поля, propertiesце наш спеціальний тип пошти, normalце місце мета-поля , і highвказує, що його слід відображати якомога вище на сторінці. (Зазвичай під редактором tinyMCE за замовчуванням).

Потім, беручи це за найосновніший приклад, ви повинні приєднати редактор tinyMCE до текстової області. Нам залишається визначити нашу second_column_boxфункцію, яка буде друкувати HTML для мета-поля, щоб це було гарне місце, як і будь-хто для цього:

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

Є кілька питань, які я не впевнений, як подолати. Редактор tinyMCE буде вкладений у метабокс, який може бути не ідеальним, і він не матиме можливості перемикатися між режимами редагування HTML і Visual, а також команди вставки медіа, які має звичайний редактор повідомлень. Переключення режимів, схоже, визначається як функція, першим аргументом якої є ідентифікатор, але все ж він, схоже, кодується в сценарій wp-tinymce. Для цього можна використовувати вбудовані функції tinyMCE, але це змінює текстову область між повним tinyMCE та базовим textarea, без жодної кнопки вставки WP HTML.

По- перше: Велике спасибі до @Thomas Макдональд для його відповіді ; Мені потрібно було вирішити саме те питання, яке задав @Paul Sheldrake, і код Томаса змусив мене почати в правильному напрямку.

На жаль, я тоді застряг, тому що мені потрібно було змінити макет із типового на більш простий і менший макет, оскільки мені потрібно було використовувати TinyMCE в бічній метабоці. Я практично скрізь шукав рішення, і особливо на MoxieCode TinyMCE Wiki та TinyMCE Tips & How To Forum і нічого не знайшов! ¹ Все , що я знайшов пояснив , як набір theme, width, heightі т.д. , використовуючи , tinyMCE.init({...})але , очевидно , ви не можете використовувати , що при використанні tinyMCE.execCommand("mceAddControl").

Я про спантеличений , коли я натрапив на статтю багаторазовим TinyMCE 3 примірників на одній сторінці з допомогою Гамільтона Чуа , і він прибив його! Його рішенням було призначити tinyMCE.settingsперед викликом tinyMCE.execCommand("mceAddControl"), наприклад:

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

Сумна частина полягає в тому, що це було насправді не важко, але це не було задокументоване ніде, де я міг знайти. Дивовижно виявити, що майже ніхто інший не стикався з цим питанням.

Таким чином, вищезазначений код генерував наступний другий TinyMCE в точно такому форматі / макеті, який потрібен мій клієнт:

_{(джерело: mikeschinkel.com )}

Тож якщо ви використовуєте код @Thomas McDonald вище, ви виявите, що вам потрібно змінити макет, не забудьте переглянути дивовижну статтю Гамільтона Чуа (спасибі Хам!) :

• Кілька екземплярів TinyMCE 3 на одній сторінці

PS Якщо ви робите щось навіть злегка неправильно, TinyMCE може просто не відображатися взагалі. Наприклад, в моєму випадку яtheme: "simple"спочаткувикористовую,і мені нічого не потрібно, і мені знадобилося більше години, щоб зрозуміти, що мені просто потрібно користуватисяtheme: "advanced". Тож якщо ви виявите, що TinyMCE не працює для вас, будьте впевнені, спробуйте змінити речі, можливо, у вас виникне аналогічна проблема. (BTW, я не пробував жодної іншої теми і не вивчав, що ще є в наявності; якщо ви знайдете інші теми, які працюють, будь ласка, дайте коментар нижче.)

Зноска

1 : Дуже засмучує! Через трохи більше місяця, коли я отримав відповідь WordPress, я зараз сподіваюся знайти відповіді на всі мої запитання такого ж рівня якості, що і тут, і в інших місцях я зазвичай знаходжу розчарування!

Оскільки я знайшов цю статтю як перший результат в Google, я просто хотів прокоментувати, що WP тепер пропонує функцію для вирішення подібних завдань.

У межах add_meta_boxфункції додайте наступний код ->

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

Куди ви хочете додати редактор TinyMCE

Довідка: wp_editor

Редактор за замовчуванням, tinymce, завантажується функцією в wp-admin / include / post.php під назвою wp_tiny_mce (); Подивіться у джерело у рядку 1350. У рядку 1478 є масив налаштувань. Один із варіантів, мабуть, позначає селектор текстових областей, до якого слід застосувати редактор javascript. Я читав цю публікацію Кігл у своєму блозі, який вказав мені на це. Прочитайте статтю, і, можливо, є спосіб зателефонувати wp_tiny_mce () у плагіні розділу адміністратора та застосувати його до другої створеної вами області тексту.

Я отримав це лише додавши "theEditor" як атрибут класу до текстової області:

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