Как добавить свой цвет в палитру редактора WordPress Gutenberg

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

Можно добавить следующий сниппет в function.php вашей темы, либо в плагин Code Snippets.

function mytheme_setup_theme_supported_features() {
    // Добавляем поддержку цветов в редакторе Gutenberg
    add_theme_support( 'editor-color-palette', array(
        array(
            'name'  => __( 'Custom Red' ),
            'slug'  => 'custom-red',
            'color' => '#e53003',
        ),
        // Вы можете добавить другие цвета здесь
    ) );
}
add_action( 'after_setup_theme', 'mytheme_setup_theme_supported_features' );

Если вы хотите добавить несколько цветов, код должен выглядеть так:

function mytheme_setup_theme_supported_features() {
    // Добавляем поддержку цветов в редакторе Gutenberg
    add_theme_support( 'editor-color-palette', array(
        array(
            'name'  => __( 'Custom Red'),
            'slug'  => 'custom-red',
            'color' => '#e53003',
        ),
        // Добавляем ещё один цвет
        array(
            'name'  => __( 'Custom Blue'),
            'slug'  => 'custom-blue',
            'color' => '#0073aa',
        ),
        // Можете добавить сколько угодно цветов
        array(
            'name'  => __( 'Custom Green'),
            'slug'  => 'custom-green',
            'color' => '#4CAF50',
        ),
    ) );
}
add_action( 'after_setup_theme', 'mytheme_setup_theme_supported_features' );

Каждый цвет добавляется как отдельный массив со следующими параметрами:

color — сам цвет в HEX, RGB или другом формате.

name — название цвета (видно в интерфейсе редактора).

slug — уникальный идентификатор (используется в CSS классах).