Enqueue styles in new site editor in WordPress 5.9

Question

Enqueue styles in new site editor in WordPress 5.9

Sanzeeb Aryal

2022年3月30日 19:49

In the block editor for posts and pages, I used to use the enqueue_block_editor_assets hook to enqueue styles for the block.

add_action( 'enqueue_block_editor_assets','load_assets_in_block' );
function load_assets_in_block() {
            wp_enqueue_style(
                'block-style',
                plugins_url( 'assets/css/block-style.css', PLAYER_PLUGIN ),
                array(),
                PLAYER_PLUGIN_VERSION,
                false
            );
}

This still works on posts and pages block, but it isn't working on the new site editor in WordPress 5.9? What is the recommended way to enqueue styles in site editor?

Topic block-editor wp-enqueue-style css Wordpress

Category Web

JoeMoe1984 · Accepted Answer · 2022年3月30日 19:49

So apparently for the site editor, you need to add the styles a little bit differently. You need to use the add_editor_style function.

add_action('after_setup_theme', 'my_add_editor_styles_to_full_site_editing');

function my_add_editor_styles_to_full_site_editing()
{
    add_theme_support('editor-styles');
    add_editor_style('site-editor.css');
}

Becareful how you style your stylesheet

This function adds your styles inline wrapped in the .editor-styles-wrapper class.

Enqueue styles in new site editor in WordPress 5.9

About