TinyMCE WordPress додавання кнопок. Як я вже сказав у вступному тексті, редактор за замовчуванням містить лише необхідні елементи. Ви можете додати функціональні можливості за рахунок додавання нових кнопок. Подаю нижче код додавання кнопки в редактор:

function add_mce_buttons($Кнопки){
  array_push($Кнопки, "hr");
  повернення $buttons;
}
add_filter("mce_buttons", "add_mce_buttons");

Ось ТУТ повний перелік усіх кнопок. Додайте код у вашу тему до файлу function.php. Кнопка також може бути доданий на 2-му або 3-му рядку наступним чином:

add_filter ( "mce_buttons_2" ,  "add_mce_buttons" ); 
add_filter ( "mce_buttons_3" ,  "add_mce_buttons" );

Створення кнопок користувача в редакторі TinyMCE:

Якщо ви використовуєте shoortcode або класи для тексту, зображення, кнопки, які також можуть бути створені.

Тут я збираюся створити кнопку у третьому ряду, кнопка буде працювати тільки в тому випадку, якщо користувач має права на редагування постів або сторінок.

Додати нижче код у function.php:

add_action('init', 'custom_mce_button');
function custom_mce_button() {
   if ( поточний_користувач_може('edit_posts') &&  поточний_користувач_може('edit_pages') )
   {
     add_filter('mce_buttons_3', 'add_button');
     add_filter('mce_external_plugins', 'add_plugin');
   }
}

Створимо ще кнопочку яка бере виділений текст у шорткод:

Функція додавання кнопки:

function add_button($buttons){ array_push($buttons,"blcss");return $buttons;}

Додаємо ще код який буде звертатися до редактора TinyMCE та WordPress:

function add_plugin($plugin_array) {
   $plugin_array['blist'] = get_bloginfo('template_url').'/scripts/customcodes.js';
   Повернення $plugin_масиву;
}

Цей код просто вказує шлях для конкретного файлу JavaScript, customcodes.js, який зберігається в папці scripts, у папці вашої теми. Ви можете жорстко закодувати шлях, але з використанням get_bloginfo методу у вас вийде більш гнучкий код для перенесення на інші сайти.
Виконайте завдання, додавши наступний код файлу з ім'ям customcodes.js . Збережіть його за певним шляхом.

(функція(){
tinymce.PluginManager.requireLangPack('blist');
tinymce.create('tinymce.plugins.blist', {
init : функція(ed, url){
ed.addCommand('cmd_css', функція(){
ilc_sel_content = tinyMCE.activeEditor.selection.getContent();
tinyMCE.activeEditor.selection.setContent('' + ilc_sel_content + ''); // замените на квадратные скобки
});
ed.addButton('blcss', {
title: 'CSS Wrap',
image: 'https://plugins.jasonbahl.com/wp-content/plugins/j2_anything_slider/js/menu_icon.png',
cmd: 'cmd_css'
});
},
createControl : функція(п, См){
return null;
},
});
тинімс. ПлагінManager.add('blist', tinymce.plugins.blist);
})();

Іконка “CSS.png” має бути 20px Х 20px.

Приховуємо непотрібні кнопки за допомогою параметрів редактора TinyMCE

Якщо ви бажаєте видалити небажані кнопки в редакторі, то просто вкажіть наступний код:

function disable_mce_buttons( $opt ) {
	$opt['theme_advanced_disable'] = 'bold,italic';
	return $opt;
}
add_filter('tiny_mce_before_init', 'disable_mce_buttons');

Ви також можете задати спеціальний параметр та показувати лише ті елементи, які ви хочете:

function custom_options( $opt ) {
	//format drop down list
	$opt['theme_advanced_blockformats'] = 'p,Попередньо,код,h3,h4';
	//font list
	$opt['theme_advanced_fonts'] = 'Arial=arial,Гельветика,sans-serif;Кур'єр Новий=кур'єр новий,кур'єр,monospace';
	//font size
	$opt['theme_advanced_font_sizes'] = '10px,12px,14px,16px,24px';
	//default foreground color
	$opt['theme_advanced_default_foreground_color'] = '#000000';
	//default background color
	$opt['theme_advanced_default_background_color'] = '#FFFFFF';
	return $opt;
}
add_filter('tiny_mce_before_init', 'custom_options);

Також працювати з кнопками редактора TinyMCE можна у файлі wp-includes/js/quicktags.js але я б не радив, при оновленні движка ваші налаштування просто злетять.

Стаття була взята та перекладена з сайту: sumtips.com

Подяки та поправки можете надсилати у коментарі.
Постараюся швидко відповісти всім.
Цей код сам використовую, так що додавання кнопок до редактора TinyMCE в WordPress має працювати ідеально.

Постараюся найближчим часом викласти ще статтю як додавати кнопки в режимі редагування коду WordPress.