Show Additional CSS Inside the Block Editor
Loads the CSS from Appearance > Customize > Additional CSS into the block editor canvas, so posts look the same while you write as they do on the site.
Opens WPIDE on
Code
add_filter( 'block_editor_settings_all', function ( $settings ) {
$css = wp_get_custom_css();
if ( '' === trim( $css ) ) {
return $settings;
}
$settings['styles'][] = array(
'css' => $css,
'__unstableType' => 'theme',
'source' => 'wpide-additional-css',
);
return $settings;
} );Notes
Rules are scoped to the editor canvas automatically; very broad selectors such as body may still need small tweaks.
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.