プログラム1歩ずつ前進

WordPressのcssのclassを確認する。

wordpressのテーマにシンプルな「yStandard」を使っているのでほぼ装飾されていませんでした。
見た目も大事なので最低限の装飾をすることにしました。

CSSの編集方法を選択する。

wordpressにはcssの編集方法は3つ用意されています。

  1. 親テーマ
  2. 子テーマ
  3. 追加CSS

今回は、「 子テーマ 」使うことにしました。

Google Chromeの「検証」を使いCSSのclass名を確認する。

cssのclass名が分からないとcssが反映されないのでGoogle Chromeの「検証」を使って確認します。

  1. 調べたいところを右クリック
  2. 検証」をクリック

サイドバーのクラス名は「sidebar-wrapper」であることが分かりました。

サイドバーのクラス名

同じように見出し「h2・h3」を確認します。

h2が「.entry-content h2
h3が「.entry-content h3

必要があれば他のクラス名も確認しましょう。

子テーマを編集

ダッシュボードの「外観」「テーマエディター」をクリック

テーマエディター
  1. スタイルシートを選択
  2. 編集するテーマで「ystandard-child」を選択
スタイルシートを選択

cssを編集する。

cssの編集

ファイルを更新をクリック

ファイルを更新をクリック