新着記事、人気記事、ナビカードにスタイルを追加

追加機能
この記事は約2分で読めます。
記事内に広告が含まれています。

はじめに

Gutenbergエディター

本スキンでは、Gutenbergエディターの以下のブロックに新たにスタイルを追加します(図1参照)。

  • 新着記事
  • 人気記事
  • ナビカード

これにより、スタイルボタンをクリックするだけで、初心者でも簡単にカードの表示を2カラム、または3カラムに変更できるようになります。
また、画面幅に応じて、以下のようにカードの表示が自動調整されます。

  • 画面幅が834px以下のときは、2カラム表示
  • 画面幅が480px以下のときは、1カラム表示

表示例

手順

以下の手順で指定します。
「デフォルト」を選択すると、標準のデザインに戻ります。

  1. 「新着記事」「人気記事」「ナビカード」ブロックを配置します。
  2. スタイルを選択します。

表示がおかしい場合は、高度な設定→追加CSSクラスを削除してください。

ショートコードでの設定方法

ショートコードを用いる場合は、オプションにclassを追加します。

[new_list class="is-style-2-columns"]
項目class
2カラムis-style-2-columns
3カラムis-style-3-columns

さいごに

本スキンのカスタマイズにより、「新着記事」「人気記事」「ナビカード」ブロックに新たなスタイルが追加されました。
これにより、CSSの追加なしで、初心者でも簡単にカードの並びを変更できます。

タイトルとURLをコピーしました