Кастомизируем цветовую палитру классического редактора Вордпресс

Кастомизируем цветовую палитру классического редактора Вордпресс

19 февраля 2019

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

Всё в одном: Вордпресс бандл для стартапов с фантастической скидкой 96%

Кто не понял, речь идет об этом

Цветовая палитра по-умолчанию

Если нажать на «Произвольный…», откроется палитра, в которой можно выбрать любой цвет. Он сохранится в нижней строке на время редактирования записи, а потом исчезнет. Иногда это очень неудобно.

Второй неприятный момент — нельзя удалить дефолтные цвета. Даже если вы никогда в жизни ими не воспользуетесь, они в отличие от нужных цветов, всегда будут под рукой.

Я покажу два примера. В первом мы добавим новые цвета к дефолтным, а во втором заменим дефолтные на свои. Пусть в качестве примера это будут основные оттенки серого: от чёрного (#000000) до белого (#FFFFFF).

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

1. Добавить цвета в палитру

Открываем functions.php активной темы и создаем там новую функцию danilin_add_colors()

function danilin_add_colors($init) {
$default_colours = '
"000000", "Black",
"993300", "Burnt orange",
"333300", "Dark olive",
"003300", "Dark green",
"003366", "Dark azure",
"000080", "Navy Blue",
"333399", "Indigo",
"333333", "Very dark gray",
"800000", "Maroon",
"FF6600", "Orange",
"808000", "Olive",
"008000", "Green",
"008080", "Teal",
"0000FF", "Blue",
"666699", "Grayish blue",
"808080", "Gray",
"FF0000", "Red",
"FF9900", "Amber",
"99CC00", "Yellow green",
"339966", "Sea green",
"33CCCC", "Turquoise",
"3366FF", "Royal blue",
"800080", "Purple",
"999999", "Medium gray",
"FF00FF", "Magenta",
"FFCC00", "Gold",
"FFFF00", "Yellow",
"00FF00", "Lime",
"00FFFF", "Aqua",
"00CCFF", "Sky blue",
"993366", "Red violet",
"FFFFFF", "White",
"FF99CC", "Pink",
"FFCC99", "Peach",
"FFFF99", "Light yellow",
"CCFFCC", "Pale green",
"CCFFFF", "Pale cyan",
"99CCFF", "Light sky blue",
"CC99FF", "Plum"
';
$custom_colours = '
"000000", "Color 0",
"111111", "Color 1",
"222222", "Color 2",
"333333", "Color 3",
"444444", "Color 4",
"555555", "Color 5",
"666666", "Color 6",
"777777", "Color 7",
"888888", "Color 8",
"999999", "Color 9",
"aaaaaa", "Color 10",
"bbbbbb", "Color 11",
"cccccc", "Color 12",
"dddddd", "Color 13",
"eeeeee", "Color 14",
"ffffff", "Color 15"
';
$init['textcolor_map'] = '['.$default_colours.','.$custom_colours.']';
$init['textcolor_rows'] = 7; // Кол-во строк
return $init;
}
add_filter('tiny_mce_before_init', 'danilin_add_colors');

Мы задаем нужные нам в палитре цвета, и в зависимости от их количества задаем в $init[‘textcolor_rows’] количество строк. В нашем случае 5 имеющихся + 2 новых = 7.

На одной строке может находиться 8 цветов. Учитывайте, последним элементом последней строки должна быть кнопка сброса цвета.

В результате это выглядит так

Цветовая палитра по-умолчанию с кастомными цветами

2. Заменить цвета палитры

Заменить их ещё проще.

Главное — правильно рассчитайте количество цветов и не забудьте оставить последнюю ячейку пустой, чтобы туда встал крестик.

function danilin_replace_colors($init) {
$custom_colours = '
"000000", "Color 0",
"111111", "Color 1",
"222222", "Color 2",
"333333", "Color 3",
"444444", "Color 4",
"555555", "Color 5",
"666666", "Color 6",
"777777", "Color 7",
"888888", "Color 8",
"999999", "Color 9",
"aaaaaa", "Color 10",
"bbbbbb", "Color 11",
"cccccc", "Color 12",
"dddddd", "Color 13",
"eeeeee", "Color 14",
';
$init['textcolor_map'] = '['.$custom_colours.']';
$init['textcolor_rows'] = 2;
return $init;
}
add_filter('tiny_mce_before_init', 'danilin_replace_colors');

В этом случае нам хватит двух строк: $init[‘textcolor_rows’] = 2;

Кастомная цветовая палитра

Кстати, в Гутенберге классический редактор по прежнему доступен в виде блока. Его можно добавить в любом месте записи и поностальгировать на старый добрый TinyMCE.

Классический редактор в Гутенберг

Всё самое новое и интересное из мира Вордпресс в моём Телеграм-канале. Подписываемся!

Популярное в этом месяце

Подпишитесь на рассылку и получайте новые материалы на электронную почту

Иван Данилин
Автор: Иван Данилин

Практикующий веб-разработчик, специализируюсь на платформе Вордпресс.

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

Лучшие премиум-темы для Вордпресс с пожизненной поддержкой
Подробнее