Почему не отображается тег more в TinyMCE WordPress?
По клике на кнопку создается новое поле textarea и на нем инициализируется tinyMCE.
wp.editor.initialize(editor_id, { mediaButtons: true, tinymce: { height: 450, wpautop: true, toolbar1: 'formatselect bold italic bullist numlist blockquote alignleft aligncenter alignright link wp_more fullscreen wp_adv', toolbar2: 'strikethrough hr forecolor pastetext removeformat charmap outdent indent undo redo wp_help', }, quicktags: true }); |
wp.editor.initialize(editor_id, { mediaButtons: true, tinymce: { height: 450, wpautop: true, toolbar1: 'formatselect bold italic bullist numlist blockquote alignleft aligncenter alignright link wp_more fullscreen wp_adv', toolbar2: 'strikethrough hr forecolor pastetext removeformat charmap outdent indent undo redo wp_help', }, quicktags: true });
все работает, за исключением того, что в визуальном редакторе не отображается тег more после вставки. В режиме кода - все ок.
если сохранить содержимое и обновить страницу, то тег начинает отображаться.
В чем может быть проблема?
Дополнительно:
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Проблема не в самом теге
more, а в том, что вы динамически создаёте новый TinyMCE-редактор. WordPress-редактор при обычной загрузке страницы инициализирует не только TinyMCE, но и набор WordPress-плагинов, кнопок, quicktags, обработчиков и состояние редактора. Если textarea добавлена позже, часть поведения может появиться только после сохранения и перезагрузки.Для вставки more в динамическом редакторе проверьте две вещи. Во-первых, кнопка должна быть в toolbar:
toolbar1: 'formatselect bold italic bullist numlist blockquote link wp_more fullscreen'
Во-вторых, после создания textarea нужно инициализировать редактор только один раз и с уникальным ID:
const editorId = 'my_editor_' + Date.now(); textarea.id = editorId; wp.editor.initialize(editorId, { mediaButtons: true, tinymce: { wpautop: true, height: 450, toolbar1: 'formatselect bold italic bullist numlist blockquote link wp_more fullscreen wp_adv', toolbar2: 'strikethrough hr forecolor pastetext removeformat charmap outdent indent undo redo wp_help' }, quicktags: true });const editorId = 'my_editor_' + Date.now(); textarea.id = editorId; wp.editor.initialize(editorId, { mediaButtons: true, tinymce: { wpautop: true, height: 450, toolbar1: 'formatselect bold italic bullist numlist blockquote link wp_more fullscreen wp_adv', toolbar2: 'strikethrough hr forecolor pastetext removeformat charmap outdent indent undo redo wp_help' }, quicktags: true });
Если кнопка вставляет
<!--more-->, но визуально разделитель не появляется, попробуйте перед инициализацией подключить стандартные editor scripts на странице админки черезwp_enqueue_editor():add_action('admin_enqueue_scripts', function () { wp_enqueue_editor(); });
Ещё один рабочий обходной путь — в момент вставки добавить маркер в текстовом режиме, а после сохранения WordPress уже сам отрисует more-разделитель в визуальном редакторе. Но если редактор нужен именно как полноценный TinyMCE, лучше использовать стандартный
wp_editor()для первого поля и аккуратно клонировать/инициализировать новые поля черезwp.editor.initialize.Также убедитесь, что ID редакторов не повторяются. Повторный ID — частая причина, почему toolbar работает частично, а кнопки WordPress ведут себя непредсказуемо.