【SWELL リストブロック】の使い方
このページでは、【SWELL リストブロック】について解説していきます。
リストというのは、文章の中で 項目を順番に並べたり、まとめて見せたりするもの です。
普通のリストではできない デザインのアレンジ が、SWELLのリストブロックなら簡単にできます。
リストには「番号なしリスト【ulタグ】」と「番号付きリスト【olタグ】」があります。
目次
リストの種類
リストは大きく分けて2種類あります。
1.番号なしリスト【ulタグ】
順番は関係ないときに使います。(例:買い物リスト、やることリスト)
- サンプル1(デフォルト)
- サンプル1(デフォルト)
- サンプル2(目次風)
- サンプル2(目次風)
- サンプル3(チェック)
- サンプル3(チェック)
- サンプル4(マル)
- サンプル4(マル)
- サンプル5(三角)
- サンプル5(三角)
- サンプル6(バツ)
- サンプル6(バツ)
- サンプル7(注釈)
- サンプル7(注釈)
2.番号付きリスト【olタグ】
順番や手順を示したいときに使います(例:作業の手順、ランキング)
- サンプル1(デフォルト)
- サンプル1(デフォルト)
- サンプル2(目次風)
- サンプル2(目次風)
- サンプル3(チェック)
- サンプル3(チェック)
- サンプル4(マル)
- サンプル4(マル)
追加装飾
リストの基本デザインに加え、さらに装飾も可能です。
「下線を加える」スタイル
- リストの項目1
- リストの項目2
- リストの項目1
- リストの項目2
「横並びにする」スタイル
- リストの項目1
- リストの項目2
- リストの項目1
- リストの項目2
【SWELL リストブロック】の入れ方
STEP
エディターを開く
投稿や固定ページの編集画面(エディター)を開きます。
画面左上、または本文中にある「+(ブロック追加)」ボタンをクリックします。

STEP
「リスト」ブロックを選ぶ
ブロックの一覧が表示されるので、
その中から 「リスト」 と書かれたブロックを選択します。

STEP
項目を入力する
1行ずつ項目を書いていくと、自動でリストとして表示されます。
項目を増やしたいときは Enterキー で次の行に追加できます。

STEP
リストの種類を選ぶ
- 番号なしリスト → 順番は関係ない
- 番号付きリスト → 手順や順番を示したい
好きな方を選びます。

STEP
デザインを選ぶ
SWELLでは、リストに アイコン・色・枠線など のデザインを簡単に追加できます。
デザインは右側の設定パネルから選べます。

デザインが選べないとき
もし選択できない場合は、次の操作を試してみてください。
- 「親ブロックを選択:リスト」 をクリック

- 右側の選択パネルから 「親のリストブロックを選択」 を押す

STEP
追加装飾
さらにリストに下線や横並びなどの装飾を加えられます。
デザインは右側の設定パネルから選択可能です。

- 項目を増やすときはEnterキーを使う
- デザインを組み合わせると、より見やすくおしゃれなリストになります
