WordPress 各種スタイルシート（CSS）出力一覧[まとめ]テーマ カスタマイズ プラグインなどの出力順 style.cssなど

WordPress 各種スタイルシート（CSS）出力一覧[まとめ]テーマ カスタマイズ プラグインなどの出力順 style.cssなど

本稿では、テーマや管理者用画面でのカスタマイズ、プラグインなどによって出力されるスタイルの種類と出力順について説明する。 前提 W3C標準のHTML 5.2ではbody内にstyleタグを書くことが認められることになったが、WordPressではシステム上、ヘッダ（headタグ）に統一されている。 ヘッダ（<head>）での出力 WordPress APIの関数「wp_head()」によって、各スタイルはテーマもプラグインもひとまとめに混在して出力される。 どの順番で出力されるか把握するのは困難で、それらを制御するのはもっと困難。 WordPress本体のスタイル 本来、ブログ全体のスタイルはテーマが決めるべきだが、WordPress本体のスタイルが出力されることがある。 特にWordPressバージョン5.2.x以降では、新規エディタ「Gutenberg」（ブロックエディタ）用のCSSファイル「style.min.css」と「theme.min.css」が自動的に＝勝手に挿入されてしまう。 さすがに、テーマのCSSより先に読み込まれるのでテーマ側のスタイルが上書きされてしまうことはないが、テーマの「functions.php」に自分でコードを書かないと削除できない。 [php] add_action('wp_enqueue_scripts', 'dequeue_style'); function dequeue_style() { wp_dequeue_style('wp-block-library'); wp_dequeue_style('wp-block-library-theme'); } [/php] テーマのスタイル いわゆる「style.css」の出力。 子テーマは親テーマの次につづけて出力されるようだが、各種プラグインのスタイルと混在している。 かならずしもテーマのスタイルが最初や最後とは限らないので、注意が必要。 管理画面の「追加 CSS」 現在のWordPressでは子テーマをつくらなくても、管理者用画面で現在のテーマにユーザー独自のスタイルを簡単に設定できる。 （左側メニュー） 外観 ＞カスタマイズ ＞追加 CSS これは、さすがにテーマの出力のあとにstyleタグで直接書き出される。 idは「wp-custom-css」。 基本的には、headタグ内の最後に