Customize Editor using Functions

November 06, 2019

These are some of the functions I use in my custom themes to setup my own defaults in Gutenberg.

I’ll keep updating this file as I discover more.

// add options to theme and backend
function mytheme_setup() {
add_theme_support( 'align-wide' ); 
add_theme_support( 'editor-styles' );
add_theme_support( 'wp-block-styles' );
add_theme_support( 'dark-editor-style' );
add_theme_support( 'responsive-embeds' );
}
add_action( 'after_setup_theme', 'mytheme_setup' );


// Adds support for editor color palette.
add_theme_support( 'editor-color-palette', array(
array(
'name' => __( 'dark-green', 'custom' ),
'slug' => 'dark-green',
'color' => '#134c4e',
),
array(
'name' => __( 'Mid Green', 'custom' ),
'slug' => 'Mid Green',
'color' => '#7bb4b0',
),
array(
'name' => __( 'Light Green', 'custom' ),
'slug' => 'light-green',
'color' => '#e4f0ef',
),
array(
'name' => __( 'Dark Orange', 'custom' ),
'slug' => 'dark-orange',
'color' => '#d05d2e',
),
array(
'name' => __( 'Mid Orange', 'custom' ),
'slug' => 'mid-orange',
'color' => '#DF7635',
),
array(
'name' => __( 'Light Orange', 'custom' ),
'slug' => 'light-orange',
'color' => '#dcb078',
),
array(
'name' => __( 'Dark Brown', 'custom' ),
'slug' => 'dark-brown',
'color' => '#7D3E1F',
),
array(
'name' => __( 'Light Brown', 'custom' ),
'slug' => 'light-brown',
'color' => '#8b502f',
),
array(
'name' => __( 'Black', 'custom' ),
'slug' => 'black',
'color' => '#000000',
),
array(
'name' => __( 'White', 'custom' ),
'slug' => 'white',
'color' => '#ffffff',
),
) );

// disable colour picker for custom colours
add_theme_support( 'disable-custom-colors' );




// Adds support for editor font sizes.
add_theme_support( 'editor-font-sizes', array(
array(
'name' => __( 'Default', 'custom' ),
'shortName' => __( 'D', 'custom' ),
'size' => 16,
'slug' => 'default'
),
array(
'name' => __( 'Medium', 'custom' ),
'shortName' => __( 'M', 'custom' ),
'size' => 22,
'slug' => 'medium'
),
array(
'name' => __( 'Large', 'custom' ),
'shortName' => __( 'L', 'custom' ),
'size' => 36,
'slug' => 'large'
),
array(
'name' => __( 'Huge', 'custom' ),
'shortName' => __( 'XL', 'custom' ),
'size' => 48,
'slug' => 'huge'
)
) );