WordPress 有沒有辦法在自定義帖子型別中獲取 N 個 WYSIWYG 編輯器？

正男 · 發表於：2017-01-08

問題描述

有沒有辦法為自定義帖子型別擁有多個所見即所得編輯器？例如，如果我有一個 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 是元框應用於它的 ID，Second Column 是元框的標題，second_column_box 是將列印出的元素的 HTML 的函式，properties 是我們的定製後期型別，normal 是元框的位置，high 指定它應該儘可能高地顯示在頁面中。 (通常在預設的 tinyMCE 編輯器下面) 。

然後，以此作為最基本的例子，您必須將 tinyMCE 編輯器附加到 textarea 。我們還需要定義我們的 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 編輯器將巢狀在一個 metabox 中，這可能不是理想的，它不具備在 HTML 和 Visual 編輯模式之間進行切換的能力，以及正常的後期編輯器具有的媒體插入命令。切換模式似乎定義為第一個引數是 ID 的功能，但它也似乎被編碼為 wp-tinymce 指令碼。可以使用內建的 tinyMCE 功能來實現，但這會改變完整的 tinyMCE 和基本文字區域之間的 textarea，而不需要任何 WP HTML 插入按鈕。

次佳解決方案

第一：感謝 @Thomas McDonald 的回答; 我需要弄清楚 @Paul 謝爾德拉克問和託馬斯的程式碼讓我從正確的方向開始的同樣的問題。

不幸的是，我被卡住了，因為我需要將佈局從預設更改為更簡單和更小的佈局，因為我需要在一個側面的 metabox 中使用 TinyMCE 。我幾乎找到了解決方案，特別是在 MoxieCode TinyMCE Wiki 和 TinyMCE Tips & How To Forum，沒有發現任何東西！ 1 我發現的一切解釋瞭如何使用 tinyMCE.init({...})設定 theme，width，height 等，但顯然您不能在使用 tinyMCE.execCommand("mceAddControl")時使用。

當我在 Hamilton Chua 的一頁上碰到文章多個 TinyMCE 3 例項時，我被困了，他釘住了！他的解決方案是在呼叫 tinyMCE.execCommand("mceAddControl")之前分配 tinyMCE.settings，例如：

<?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，正是我的客戶端需要的格式/佈局：

所以如果你使用 @Thomas 麥克唐納程式碼，你會發現你有任何需要修改的佈局，一定要檢查漢密爾頓蔡司的真棒文章 (謝謝火腿！)：

一個頁面上有多個 TinyMCE 3 例項

附：如果你做的事情甚至有點錯誤，TinyMCE 可能根本就不會顯示出來。例如，在我的情況下，我首先使用 theme: "simple"，沒有什麼，花了我一個多小時才意識到，我只需要使用 theme: "advanced"。所以如果你發現 TinyMCE 是不適合你一定要嘗試改變的事情，你可能有類似的問題。 (BTW，我還沒有嘗試任何其他的主題，也沒有探索還有什麼可用的; 如果你發現其他主題工作，請在下面發表評論。)

Footnote

1：很沮喪！用 WordPress 回答一個多月以後，我現在希望找到我所有問題的答案與這裡一樣的質量水平，其他地方我通常會感到失望！

參考文獻

Is there a way to get N number of WYSIWYG editors in a custom post type?

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。

WordPress 有沒有辦法在自定義帖子型別中獲取 N 個 WYSIWYG 編輯器？