如何在前端包含TinyMCE编辑器？

时间：2011-05-20 作者：Sisir

我正在尝试在我的前端添加一个TinyMCE编辑器，用户可以在那里发帖，但到目前为止运气不佳。代码如下：

PHP:

add_action(\'wp_print_scripts\', \'my_enqueue_scripts\');

function my_enqueue_scripts() {      
        wp_enqueue_script( \'tiny_mce\' );
        if (function_exists(\'wp_tiny_mce\')) wp_tiny_mce();
}

Javascript:

jQuery(document).ready(function(){
tinyMCE.init({
        mode : "textareas",
        theme : "simple", 
        /*plugins : "autolink, lists, spellchecker, style, layer, table, advhr, advimage, advlink, emotions, iespell, inlinepopups, insertdatetime, preview, media, searchreplace, print, contextmenu, paste, directionality, fullscreen, noneditable, visualchars, nonbreaking, xhtmlxtras, template",*/
        editor_selector :"editor"
    });
});

HTML:

<textarea rows="8" cols="40" name="description" id="editor" class="required"><?php echo $description;?></textarea>
Problem: Texteditor未添加到textarea。尽管TinyMCE js文件正在加载。

4 个回复
最合适的回答,由SO网友:Sisir 整理而成

好吧，多亏了wp 3.3现在我们有了wp_editor() 执行此操作的函数：）

SO网友:maryisdead

editor_selector 用于定位类，而不是ID。

此外，使用时editor_selector, 需要设置mode: "specific_textareas" 为了让它工作。

看见http://tinymce.moxiecode.com/wiki.php/Configuration:editor_selector

因此，您的JavaScript和HTML应该如下所示：

jQuery(document).ready(function(){
tinyMCE.init({
        mode : "specific_textareas",
        theme : "simple", 
        /*plugins : "autolink, lists, spellchecker, style, layer, table, advhr, advimage, advlink, emotions, iespell, inlinepopups, insertdatetime, preview, media, searchreplace, print, contextmenu, paste, directionality, fullscreen, noneditable, visualchars, nonbreaking, xhtmlxtras, template",*/
        editor_selector :"tinymce-enabled"
    });
});

<textarea rows="8" cols="40" name="description" id="editor" class="tinymce-enabled required"><?php echo $description;?></textarea>

SO网友:adrian7

虽然@maryisdead的答案可能是正确的，但我会给你另一个提示，首先确保页面中只有一个id为=“editor”的元素，然后像这样设置tinymce：

tinyMCE.init({
    ...
    mode : "exact",
    elements : "editor"
});
在javascript代码中使用jQuery而不是$，以确保调用的是jQuery方法和选择器。

SO网友:Franklin Inbaraj

editor\\u选择器用于类，不用于ID。

您应该使用editor\\u selector的值作为textarea的类名。

结束
标签： tinymce   front-end   小码农  

相关推荐

如何将拆分按钮或列表框添加到WordPress TinyMCE实例

我已经在tinymce中添加了一个自定义按钮来插入我的短代码，但我有这么多，我想改为制作一个拆分按钮，我不知道怎么做。任何人都可以帮忙。下面是我用来创建普通按钮的代码：在函数中。php：/** Hook into WordPress */ add_action(\'init\', \'onehalf_button\'); /** Create Our Initialization Function */ function on