こんにちは。SaitoKouです。
前回の記事では、本テーマの最大の特徴である「スタイル」機能について簡単に触れていきました。
この機能の追加によって、サイト全体の外観を簡単に変更できるようになりました。今回の記事では、そのスタイルを要素ごとに変更できる機能についてみていきます。
「要素別スタイル」の便利な点
たとえば、下図のような記事があったとします。（スタイル機能がないTwenty Twenty-Oneを使用）
この記事には見出し要素の数が2つですが、これらの色を二つとも赤色にしたいとします。その場合、以下の操作が必要です。
- 方法➀：ブロックエディタで、「見出しブロック」一つ一つのカラーを変更する。
- 方法②：カスタムCSSを用いて、すべての見出し要素が同じカラーになるように記述する。
➀の場合だと、見出しの数が増えた場合に作業がめんどくさいです。
②の場合、一括で見た目を変更することはできますが、HTMLとCSSの知識が多少必要になってきます。
スタイル機能は、上記の難点をスムーズに解決してくれます！各要素ごとに、コーディングの知識を必要とせず、見た目の変更が可能です。
設定方法
Twenty Twenty-Threeでも、同じように見出しの色を変更したいとします。
下図は、もとの投稿画面です。
WordPress管理画面 ＞ 外観 ＞ エディタを選択します。
すると、下のような画面になるので、右上の円形のボタンを押します。
サイドバーにスタイルツールが表示されますので、一番下の「ブロック」を選択します。
要素の一覧が表示されますので、見出しを選択します。
見出しの色を変更するため、色を選択します。
「テキスト」から色を選びます。
その後、右上の「保存」ボタンを押します。
保存完了後、投稿を見てみると・・・
見事に見出しのみ、色が変更されていますね！
このように、特定の要素にのみ、見た目の変更を加えたい場合に、効率的にかつコーディング知識不要で変更できます。これはかなり便利です。
まとめ
Twenty Twenty-Threeで実装されているスタイルは、サイト全体の雰囲気だけでなく、固定の要素の見た目を変更したいときにも効率化が図れることがわかりました！Twenty Twenty-Twoの時からの新エディタで見た目の変更の柔軟性が増しましたが、より変更を加えやすくなっているようです！まだまだこのテーマの特徴を探してみたいと思います！
みなさまのホームページやイメージがよくなるお手伝いをいたします。
ヘッダー画像、バナー画像、ロゴ、WordPressデザインなどお気軽にご相談ください！
WordPressデザインサービスは以下から承っております。
