Load editor-style.css

  • pixx
    July 24, 2025 at 9:27 am

    Hi all,

    I am using a child theme and would like to use my own CSS in the editor.

    I have this code in the functions.php file in the generatepress_child directory:

    add_action( ‘after_setup_theme’, ‘generate_child_setup’ );
    function generate_child_setup()
    {
    add_editor_style( ‘editor-style.css’ );
    }

    The editor-style.css file is located in the same directory.

    Unfortunately, the file is not loaded in the editor.

    Why is that?

  • Ying
    July 24, 2025 at 12:30 pm

    Hi there,

    Give this code a try:

    add_filter( 'generate_editor_styles', function( $editor_styles ) {
    $editor_styles[] = 'editor-style.css';

    return $editor_styles;
} );
  • pixx
    July 24, 2025 at 8:04 pm

    Hi Ying,

    unfortunately, the file still won’t load.

  • Alvind
    July 24, 2025 at 8:18 pm

    Hi there,

    It looks like there is no stylesheet file named editor-styles.css in your child theme. I can only see the default style.css file: https://cln.sh/TXlcrp3Q4brZMDDZGHpJ

    If you were referring to the style.css file, then this snippet should work:

    add_filter( 'generate_editor_styles', function( $editor_styles ) {
    $editor_styles[] = 'style.css';
    return $editor_styles;
} );
  • pixx
    July 25, 2025 at 1:36 am

    Hi Alvind,

    the file editor-style.css is there. I added a screenshot.

  • Alvind
    July 25, 2025 at 6:50 am

    Try adding this snippet as well:

    function ac_enqueue_custom_styles() {
    $stylesheet_path = get_stylesheet_directory() . '/editor-style.css';
    
    wp_enqueue_style(
        'editor-style-css',
        get_stylesheet_directory_uri() . '/editor-style.css',
        array(),
        filemtime($stylesheet_path)
    );
}
add_action('wp_enqueue_scripts', 'ac_enqueue_custom_styles');

    in addition to Ying’s snippet above.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.