有没有办法为自定义帖子类型设置多个WYSIWYG编辑器?例如,如果我有一个2列布局,我希望一列有一个编辑器,另一列有另一个编辑器。
有没有办法在一个定制的帖子类型中获得N个所见即所得的编辑?
假设调用了自定义帖子类型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和视觉编辑模式之间切换的功能,也不具备普通post编辑器所具有的媒体插入命令。切换模式似乎被定义为第一个参数是ID的函数,但它似乎也被编码到wp tinymce脚本中。可以使用内置的tinyMCE函数来执行此操作,但这会在完整tinyMCE和基本textarea之间更改textarea,而无需任何WP HTML插入按钮。首先:Big Thanks 致托马斯·麦克唐纳his answer; 我需要找出保罗·谢尔德雷克(PaulSheldrake)提出的完全相同的问题,托马斯的密码让我朝着正确的方向开始。
不幸的是,我被卡住了,因为I needed to change the layout from the default 因为我需要在侧元框中使用TinyMCE,所以布局更简单、更小。我到处寻找解决方案,尤其是在MoxieCode上TinyMCE Wiki 和TinyMCE Tips & How To Forum 什么也没找到1theme, width
, height
, 等使用tinyMCE.init({...})
但很明显,当你使用tinyMCE.execCommand("mceAddControl")
.
当我无意中看到那篇文章时,我几乎被难住了multiple TinyMCE 3 instances on one page 通过Hamilton Chua, 他成功了!他的解决办法是分配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,其格式/布局正是我的客户所需要的:
因此,如果您正在使用上面的Thomas McDonald代码,您会发现您有任何需要修改布局的地方,请务必查看Hamilton Chua的精彩文章(谢谢Ham!):
P.S.theme: "simple" 起初,我什么都没有,花了一个多小时才意识到我只需要使用theme: "advanced"
. 因此,如果您发现TinyMCE不适合您,请务必尝试改变周围的情况,您可能会遇到类似的问题(顺便说一句,我没有尝试过任何其他主题,也没有探索过其他可用的主题;如果你找到其他有用的主题,请在下面发表评论。)脚注
1: <真令人沮丧!在使用WordPress的答案一个多月后,我现在希望能找到与这里一样高质量的所有问题的答案,而在其他地方,我通常会感到失望由于我在Google上发现这篇文章是第一个结果,我只想评论一下,WP现在提供了一个处理这类任务的功能。
在add_meta_box
函数,添加以下代码-->
wp_editor( $content, $editor_id, $settings = array() );
无论你想在哪里添加TinyMCE编辑器参考:wp_editor
默认编辑器tinymce由wp admin/includes/post中的函数加载。php称为wp_tiny_mce();Look in the source 第1350行。第1478行有一组设置。其中一个选项显然指定了要应用javascript编辑器的textarea选择器。我在看书this post by Keighl 在他的博客上给我指出了这一点。阅读本文,也许有一种方法可以在管理部分插件中调用wp_tiny_mce(),并将其应用到您创建的第二个文本区域。