Skip to content

Instantly share code, notes, and snippets.

@kimcoleman
Last active July 14, 2022 13:59
Show Gist options
  • Save kimcoleman/673e075dbe7130478a53c307dfb585ff to your computer and use it in GitHub Desktop.
Save kimcoleman/673e075dbe7130478a53c307dfb585ff to your computer and use it in GitHub Desktop.
Add colors to block editor color palette.
<?php
/**
* Add colors to block editor color palette.
*
*/
function my_custom_colors_block_editor( $editor_settings, $editor_context ) {
$my_custom_colors = array(
array(
'name' => __( 'New Color 1', 'textdomain' ),
'slug' => 'my-new-color-1',
'color' => '#BF665E',
),
array(
'name' => __( 'New Color 2', 'textdomain' ),
'slug' => 'my-new-color-2',
'color' => '#253659',
),
array(
'name' => __( 'New Color 3', 'textdomain' ),
'slug' => 'my-new-color-3',
'color' => '#f2f5f7',
)
);
$editor_settings['colors'] = array_merge( $editor_settings['colors'], $my_custom_colors );
return $editor_settings;
}
add_filter( 'block_editor_settings_all', 'my_custom_colors_block_editor', 10, 2 );
/**
* Make sure the palette includes everything from theme.json, your block editor filter, and add more if you want.
*/
function mytheme_setup_theme_supported_features() {
$editor_settings = get_block_editor_settings( array(), 'core/edit-post' );
$new_colors = array(
array(
'name' => __( 'New Color 4', 'textdomain' ),
'slug' => 'my-new-color-4',
'color' => '#03A696',
),
array(
'name' => __( 'New Color 5', 'textdomain' ),
'slug' => 'my-new-color-5',
'color' => '#F27457',
),
);
add_theme_support( 'editor-color-palette', array_merge( $editor_settings['colors'], $new_colors ) );
}
add_action( 'after_setup_theme', 'mytheme_setup_theme_supported_features', 11 );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment