背景色を変える

Twenty Twenty-Threeの背景色を変えてみた。

  1. ワードプレスにログインした状態で、サイトを表示 → フロントページを表示 → ヘッダーメニューから「サイトを編集」
  2. 「スタイル」アイコンを押すと、スタイルのメニューが出現する
  3. 「表示スタイル」で総合的なデザインが好みのスタイルを選ぶ
  4. 「色 → パレット」でカスタムパレットを登録する(必須ではない)
  5. 「色 → 背景色」を変更する

画面右上に「スタイル」のアイコンがあるので、それを押すとメニューが出てくる。変更できるのは「表示スタイル」、「タイポグラフィー」、「色」、「レイアウト」、「ブロック」。

つまり、なんでもできる。

Twenty Twenty-Three、スタイル機能
Twenty Twenty-Three、スタイル機能

「表示スタイル」は、デザインパッケージみたいなもので、コンテンツ幅、文字の大きさ、色などが一式設定されているので、気にいったものを選んで詳細設定に入る。

Twenty Twenty-Threeスタイルを変える
Twenty Twenty-Threeスタイルを変える

下の図は「デフォルト」の表示スタイルを選んで、「色」メニューから背景色などを変えようとしているところ。背景の他に、テキスト、リンク、見出し、ボタンなどの配色を変えられる。

Twenty Twenty-Three、背景色の変更
Twenty Twenty-Three、背景色の変更

同じ色を何回も使うときは、パレットのカスタムで色を登録しておくとスムーズ。

Twenty Twenty-Three、パレットの追加、指定
Twenty Twenty-Three、パレットの追加、指定

最後に背景にパレットのカスタムカラーを指定したら、サイト全体の背景が変更される。

Twenty Twenty-Three、背景色の指定
Twenty Twenty-Three、背景色の指定


投稿日

カテゴリー:

投稿者:

タグ:

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です