Dequeue only stylesheets but not inline style added using wp_add_inline_style

by

I have this two line below on my parent theme:

wp_enqueue_style('theme-dynamic-styles', get_template_directory_uri() . '/custom.css');        
wp_add_inline_style('theme-dynamic-styles', $output);

this custom css, which I want to dequeue on child theme, but both the stylesheet and the inline style are using same handle name – theme-dynamic-styles, hence both got dequeued. Is there a way to dequeue only the enqueued stylesheet, but not the inline style added using wp_add_inline_style?

1 Answer
1

wp_add_inline_style must accompany with an existing enqueued style. So the moment you dequeue or deregister that style, the associated inline style also gets dequeued or deregistered.

To avoid that, you must first retrieve the inline style and then dequeue.

Method-1:

If after dequeueing theme-dynamic-styles handle, you don’t want to enqueue a new one in its place, then you’ll have to enqueue the inline style with the default stylesheet. For example, say your default style handle name is twentyseventeen-style. In that case, your CODE will be like this:

function wpse262235_dequeue_style() {
    $handle="theme-dynamic-styles";
    // get the inline style (returns as array)
    $inline_styles =  wp_styles()->get_data( $handle, 'after' );
    wp_dequeue_style( $handle );
    if( ! empty( $inline_styles ) ) {
        wp_add_inline_style( 'twentyseventeen-style', implode( "\n", $inline_styles ) );
    }
}
// make sure the priority is higher than the hook that enqueued the style
add_action( 'wp_enqueue_scripts', 'wpse262235_dequeue_style', 20 );

Method-2:

If after dequeueing theme-dynamic-styles handle, you want to enqueue a new one in its place with the same handle name, then you’ll have to deregister theme-dynamic-styles, dequeuing is not enough. In this case, your CODE will be like this:

function wpse262235_dequeue_style() {
    $handle="theme-dynamic-styles";
    $inline_styles =  wp_styles()->get_data( $handle, 'after' );
    wp_deregister_style( $handle );
    // a new style from child theme with the same handle
    wp_enqueue_style( $handle, get_stylesheet_directory_uri() . '/custom.css' );
    if( ! empty( $inline_styles ) ) {
        wp_add_inline_style( $handle, implode( "\n", $inline_styles ) );
    }
}
add_action( 'wp_enqueue_scripts', 'wpse262235_dequeue_style', 20 );

Leave a Comment