web-dev-qa-db-ja.com

フロントエンドにTinyMCEエディタを含めるにはどうすればいいですか?

私は自分のフロントエンドに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>

問題: Texteditorがtextareaに追加されない。 TinyMCE jsファイルはロード中ですが。

22
Sisir

さて、wp 3.3のおかげで、今は wp_editor() functionということになります:)

14
Sisir

editor_selectorはクラスではなく、クラスを対象としています。

また、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>
2
maryisdead

@maryisdeadという答えは大丈夫かもしれません。ヒントをもう1つ紹介します。まず、ページにid = "editor"の要素が1つしかないことを確認してから、次のように設定します。

tinyMCE.init({
    ...
    mode : "exact",
    elements : "editor"
});

JQueryのメソッドとセレクタを確実に呼び出すために、JavaScriptコードで$の代わりにjQueryを使用してください。

0
adrian7

editor_selectorはクラス用であり、ID用ではありません。

Textareaのクラス名としてeditor_selectorの値を使うべきです。

0