Как добавить к классический редактор wp свой прессет?

Question

[Roman]

Добрый день. Использую классический редактор wp. Нужно в него добавить свой стиль(в выпадающий селект)\ в виде кнопки. Пытаюсь сделать это по гайду . Не ошибок в консоли не новой кнопки в редакторе не вижу. Прикрутил даже уже Advanced Editor Tools и выбрал

Create CSS classes menu
Load the CSS classes used in editor-style.css and replace the Formats menu.

/* functions.php */
function custom_editor_styles() {
    add_editor_style('editor-style.css'); // Подключите ваш файл стилей, если необходимо
}

function add_custom_format($formats) {
    $formats['custom_format'] = 'Мой Пресет';
    return $formats;
}

add_action('admin_init', 'custom_editor_styles');
add_filter('mce_buttons_2', 'add_custom_format');

/* editor-style.css */
/* Общие стили для редактора */
body {
    font-family: Arial, sans-serif; /* Основной шрифт */
    line-height: 1.6; /* Высота строки */
}

/* Стили для вашего прессета */
.mce-content-body .custom_format {
    font-size: 1.5em; /* Размер шрифта */
    font-weight: bold; /* Жирный текст */
    color: #0073aa; /* Цвет текста */
    background-color: #f0f8ff; /* Цвет фона */
    padding: 10px; /* Отступы */
    border-left: 5px solid #0073aa; /* Левая граница */
    margin-bottom: 20px; /* Отступ снизу */
}

Answer 1

[Roman]

Решил вопрос
Добавление в режиме html редактора

add_action( 'admin_print_footer_scripts', 'theme_add_quicktags', 99 );
function theme_add_quicktags() {
	if ( ! wp_script_is('quicktags') )
		return;

	?>
	<script>
	document.addEventListener( 'DOMContentLoaded', function(){

		QTags.addButton( 'r4_div_blue', 'div_blue', '<div class="color-blue">', '</div>', 'd', 'Div blue', 1 );
		QTags.addButton( 'r4_h3_blue', 'h3_blue', '<h3 class="color-blue">', '</h3>', 'h', 'H3 blue', 2 );
		QTags.addButton( 'r4_ol_lg', 'ol_lg', '<ol class="lg-list">', '</ol>', 'o', 'Ol lg', 3 );
		
	} );
	</script>
	<?php
}
//QTags.addButton( id, display, arg1, arg2, access_key, title, priority, instance );

Добавление в режиме визуального редактора (кнопки )
tinymce-buttons.js

(function() {
    tinymce.create('tinymce.plugins.theme_buttons', {
        init : function(ed, url) {
            ed.addButton('r4_div_blue', {
                title : 'Div blue',
                icon: 'mce-ico mce-i-checkmark', // использование иконки Dashicons
                onclick : function() {
                    ed.execCommand('mceInsertContent', false, '<div class="color-blue"></div>');
					ed.label = 'Div blue';
                }
            });
            ed.addButton('r4_h3_blue', {
                title : 'H3 blue',
                icon: 'mce-ico mce-i-checkmark', // использование иконки Dashicons
                onclick : function() {
                    ed.execCommand('mceInsertContent', false, '<h3 class="color-blue"></h3>');
					ed.label = 'H3 blue';
                }
            });
            ed.addButton('r4_ol_lg', {
                title : 'Ol lg',
                icon: 'mce-ico mce-i-checkmark', // использование иконки Dashicons
                onclick : function() {
                    ed.execCommand('mceInsertContent', false, '<ol class="lg-list"><li></li></ol>');
					ed.label = 'Ol lg';
                }
            });
        }
    });
    tinymce.PluginManager.add('theme_buttons', tinymce.plugins.theme_buttons);
})();

function.php

function theme_tinymce_plugin($plugin_array) {
    $plugin_array['theme_buttons'] = get_template_directory_uri() . '/assets/js/tinymce-buttons.js?v=17'; // путь к вашему JS файлу
    return $plugin_array;
}

function theme_register_buttons($buttons) {
    array_push($buttons, 'r4_div_blue', 'r4_h3_blue', 'r4_ol_lg');
    return $buttons;
}

PS Осталось понять как в выпадающий список запихнуть прессеты.

Comments

[Владимир Брумер]

Осталось понять как в выпадающий список запихнуть прессеты

полагаю Вам нужно контекстное меню

а вообще вариантов много...
я, например, использую тот же вариант, что и по ссылке выше

spoiler

tinymce.PluginManager.add('VAB_tags_button',function(editor,url){editor.addButton('VAB_tags_button',{type:'menubutton',text:TrTags,title:TrTagsTitle,icon:false,menu:[{text:TrCode,onclick:function(){editor.insertContent(....

[Roman]

Владимир Брумер, мне бы сюда добавить пункты