WordPress総合ポータルカスタムCSSの追加方法
テーマの標準デザインを少しだけ調整したい場合、カスタムCSSの追加が最も手軽な方法です。
① クラシックテーマでの追加方法
- 「外観」→「カスタマイズ」→「追加CSS」からコードを入力（最も手軽）
- 子テーマのstyle.cssに直接記述する（本格的なカスタマイズ向け）
- 専用プラグイン（WPCode等）でコードスニペットとして管理する
② ブロックテーマでの追加方法
ブロックテーマ（フルサイト編集対応テーマ）では、従来の「外観」→「カスタマイズ」画面自体が用意されていません。CSSを追加する場所が変わっている点に注意してください。
- 「外観」→「エディター」からサイトエディターを開く
- 右上の「スタイル」アイコンを選択
- 三点リーダーメニュー（⋮）から「追加CSS」を選択し、コードを入力する
この方法で入力したCSSは、テーマファイルではなくデータベース（グローバルスタイル）に保存されるため、テーマの更新後も消えません。さらにWordPress 7.0以降は、個別のブロックを選択し「高度な設定」内の「追加CSS」欄から、そのブロックだけに適用されるCSSを指定することもできるようになっています。
メディアクエリの制限に注意ブロック単位の「追加CSS」欄では、メディアクエリ（レスポンシブ対応のための記述）が正しく機能しない場合があります。画面サイズに応じたスタイル調整は、サイト全体の「追加CSS」に記述することが推奨されています。
③ 注意点
親テーマを直接編集しない親テーマのstyle.cssを直接編集すると、テーマ更新時にカスタマイズが消えてしまいます。必ず子テーマまたは「追加CSS」機能を使いましょう。
④ よくある質問（FAQ）
「外観」→「カスタマイズ」自体が見当たりません。なぜですか？
ブロックテーマを使用している場合、従来の「カスタマイズ」画面自体が用意されていません。代わりに「外観」→「エディター」（サイトエディター）を開き、右上の「スタイル」アイコンから三点リーダーメニューを開くと「追加CSS」の項目があります。
ブロック単位でCSSを指定することはできますか？
ブロックテーマでは、個別のブロックを選択し、ブロック設定パネルの「高度な設定」内にある「追加CSS」欄から、そのブロックだけに適用されるCSSを指定できます。ただしこの機能ではメディアクエリが正しく機能しないことがあるため、レスポンシブ対応が必要なスタイルはサイト全体の「追加CSS」に記述することが推奨されています。
追加CSSと子テーマ、結局どちらを使えばよいですか？
数行程度の軽微な調整であれば「追加CSS」で十分です。大量のスタイル変更や、CSS以外にPHPのカスタマイズも将来的に行う可能性がある場合は、最初から子テーマとして管理した方が見通しがよくなります。