How do I load styles into the block editor admin screen?

Question

The core file 'load-styles.php' generates css styles. Some of the styles interfere with the block editor.

I would like to pass in my own style rules that override the styles generated by 'load-styles.php'.

How can I do this?

Answer 1

The same way you do it for the classic editor, there's a dedicated API for this:

https://developer.wordpress.org/reference/functions/add_editor_style/

https://developer.wordpress.org/reference/functions/add_editor_style/#comment-1171:

/**
 * Registers an editor stylesheet for the theme.
 */
function wpdocs_theme_add_editor_styles() {
    add_editor_style( 'custom-editor-style.css' );
}
add_action( 'admin_init', 'wpdocs_theme_add_editor_styles' );

The block editor will read in your stylesheet, modify the rules so that they only apply to the content and don't clash, then print them out dynamically.

You can also enqueue on enqueue_block_editor_assets similar to the the other enqueuing hooks, but this shouldn't be used for styling blocks and other post/page content. This is intended for plugins that extend the block interface to add panels and other areas.