Как мне включить редактор Tinymce в The Frontend?

wordpress.stackexchange https://wordpress.stackexchange.com/questions/17786

  •  22-10-2019
  •  | 
  •  

Вопрос

Я пытаюсь добавить редактор 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 загружается.

Это было полезно?

Решение

Что ж, спасибо WP 3.3, теперь у нас wp_editor() Функция для этого :)

Другие советы

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>

Allough @maryisdead ответ может быть правильным, я дам вам еще один совет, сначала убедитесь, что на вашей странице есть только один элемент с id = "редактор", а затем настроите Tinymce как SO:

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

Также используйте jQuery вместо $ в коде JavaScript, чтобы убедиться, что вы звоните методам и селекторам jQuery.

editor_selector для классов, а не для идентификаторов.

Вы должны использовать значение editor_selector в качестве имени класса Textarea.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с wordpress.stackexchange
scroll top