Cocoonの親テーマのCSSを読み込ませない方法

最近のCSSを改めて勉強し直すついでに、ブログのデザインを一から作り直すことにしました。その際に、親テーマのCSSを読み込ませないようにしたので、その方法を忘れないうちに備忘録。僕のようにCSSを全てリセットして一から作り直したい、もっとカスタマイズの自由度あげたい人向けです。

読み込ませなくすると、ブログ全体のレイアウトや装飾を一からCSSで作り直すことになります。CSSに慣れてない方にはおすすめしません！

親テーマのCSSを読み込ませなくする方法
ワードプレスのデフォルトCSSも一緒に

親テーマのCSSを読み込ませなくする方法

子テーマのfunctions.phpに以下の記述を書き足すと親テーマのCSSを読み込ませなくできます。

function my_dequeue_parent_style() {
    wp_dequeue_style( 'cocoon-style' );
}
add_action( 'wp_enqueue_scripts', 'my_dequeue_parent_style', 11 );

ワードプレスのデフォルトCSSも一緒に

ワードプレスのデフォルトCSSも一緒に読み込ませないようにしたい方は。以下の記述にしてください。

function my_dequeue_cocoon_and_wp_styles() {
    // Cocoon親テーマのCSSを読み込まない
    wp_dequeue_style( 'cocoon-style' );

    // WordPressデフォルトのCSSを読み込まない
    wp_dequeue_style( 'wp-block-library' ); // ブロックライブラリのCSS
    wp_dequeue_style( 'global-styles' ); // グローバルスタイルのCSS
}
add_action( 'wp_enqueue_scripts', 'my_dequeue_cocoon_and_wp_styles', 11 );

短いですが以上です。あとは子テーマを使って自由にデザイン！