Установка кнопки «Произвольный символ» в полноэкранный режим

При написании статей для блога, я обычно пользовался стандартным редактором WordPress, однако недавно решил опробовать для себя нечто новое, а именно — полноэкранный режим или, как его еще называют, Дзен-режим. В целом я остался им доволен, однако, как Вы понимаете, есть один момент, который меня не устраивает — отсутствие кнопки, позволяющий вставить произвольный символ в текст.

#image.jpgОтсутствие же других кнопок нисколько меня не напрягает, так как для их нажатия можно использовать горячие клавиши, чего нельзя сказать об этой. Поэтому я решил исправить это, на мой взгляд, недоразумение. Установка кнопки "Произвольный символ" в полноэкранный режим (WordPress, Сайт, Скрипт)

Добавление кнопки

Для добавления этой кнопки, нам понадобится отредактировать файл functions.php Вашей текущей темы. Путь к этому файлу представлен ниже:

/wordpress/wp-content/themes/имя_вашей_темы/functions.php

В конец этого файла нужно добавить следующий код.

function enable_charmap_button( $buttons ) {
$buttons['charmap'] = array(
'title' => __("Произвольный символ"),   // Заголовок кнопки
'onclick' => "document.getElementsByClassName('mce-i-charmap')[0].parentNode.click()",  // Действие при нажатии на кнопку
'both' => false                         // Показывать ее только в визуальном (WYSIWIG) режиме
);
return $buttons;
}
// Применяем стандартный фильтр WordPress wp_fullscreen_buttons
add_filter('wp_fullscreen_buttons', 'enable_charmap_button');

Хотя в коде присутствуют комментарии, я все же поясню, что здесь происходит. Мы описываем функцию enable_charmap_button, которая принимает один параметр — массив всех кнопок. В теле функции в массив $buttons добавляется новый элемент (наша кнопка), который является массивом, состоящим из трех элементов:

  • title — заголовок кнопки (текст, который появляется при наведении курсора)
  • onclick — действие, которое должно выполниться, при нажатии на кнопку
  • both — параметр, который указывает, в обоих ли редакторах (визуальном и текстовом) должна отображаться кнопка

После добавления кнопки, функция просто возвращает наш массив. Теперь, чтобы эта функция работала так, как нам нужно, необходимо применить указанный в коде фильтр.

Вот такими нехитрыми действиями мы добавили кнопку на панель редактора в полноэкранном режиме. Единственное, я хочу заметить, что если у вас подключена библиотека JQuery, то Вы можете сделать немного проще, заменив строку

'onclick' => "document.getElementsByClassName('mce-i-charmap')[0].parentNode.click()",

следующей:

'onclick' => "$('.mce-i-charmap').parent().click();",

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *