ブログを書いていると、リストを使って説明することがあるかと思います。
この記事では、WordPress(Cocoonテーマ)での箇条書きリストと番号付きリストの基本的な作成方法を解説します。
![Dさん](https://saikoulife.com/wp-content/uploads/2023/12/d_smile-face.png)
一緒にリストを使いこなしましょう!
箇条書きリストの作成方法
箇条書きリストは、複数の項目を羅列して表示するのに適しています。
次の手順にそって作成できます。
- 新しい投稿の編集画面を開きます。
- 入力するブロックを選択しブロックを追加します。
- 「リスト」をクリックします。
- リストの各項目を入力します。新しい項目を追加するには、Enterキーを押します。
デフォルトでリストを作成すると箇条書きになります。
ブロックからリストを選ぶと、、
![](https://saikoulife.com/wp-content/uploads/2024/01/スクリーンショット-2024-01-03-22.17.45.png)
・←こんな黒丸が出てきます。
1行ずつリスト文を入力してエンターキーで改行すればどんどんリストを作成できます。
以下のように作成しました。
- アイウエオ
- カキクケコ
番号付きリストの作成方法
番号付きリストは、情報を順番で表示するのに適しています。
途中までは箇条書きリストと同じ手順で作成します。
- 新しい投稿の編集画面を開きます。
- 入力するブロックを選択しブロックを追加します。
- リストをクリックします。
- リストの各項目を入力します。新しい項目を追加するには、Enterキーを押します。
リストを表示させてから番号付きリストに変更していきます。
リストを選択したときに表示される項目の左端「リストを選択」をクリックします。
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.06.42.png)
↓
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.03.39.png)
クリックした箇所のすぐ右に「順序なしリスト」と「順序つきリスト」を切り替える項目が出てきますので、「順序付きリスト」を選択しましょう。
![](https://saikoulife.com/wp-content/uploads/2024/01/スクリーンショット-2024-01-03-22.31.30.png)
- アイウエオ
- カキクケコ
↑このようになりました。
リストのカスタマイズ
WordPressでは、リストのスタイルをカスタマイズすることも可能です。
以下のようなカスタマイズができます。
リストを囲む
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.06.42.png)
リストを囲むことで目立たせることができます。
リストを選択したら上に表示される項目の右端にあるオプションを選択します。
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.05.31.png)
出てくる項目の中から「親ブロックを選択(リスト)」を選びます。
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.07.55.png)
編集画面右サイドバーのブロックタブ>設定 の各項目が選択可能になります。
そこから[C]ボーダー設定をクリック。
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.08.56.png)
いろんなボーダー(ふち)が選べるようになります。
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.10.57.png)
好きなヤツを選んだら出来上がり!
- アイウエオ
- カキクケコ
リストのスタイルを変更する
リストのスタイルを変更する時も、囲む時と同じように親ブロックを選択(リスト)します。
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.07.55.png)
[C]ボーダー設定の真下にある[C]スタイルを選択します。
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.08.56.png)
![](https://saikoulife.com/wp-content/uploads/2023/12/スクリーンショット-2023-12-31-1.13.28.png)
リストのスタイルを選択できるようになりますので、ここから合いそうなスタイルを選択します。
できあがりました!
まとめ
- 箇条書きリストはブロックからリストを選び、各項目を入力し改行することでできあがる
- 番号付きリストへ変更するには、「リストを選択」し「順序付きリスト」を選択する
- 親ブロックを選択し、ボーダー設定を選ぶことでリストのふちを囲むことができる
- 親ブロックを選択し、スタイルを選ぶことでスタイル変更できる
リスト作成も、なれてくればどんどん使いこなせるようになります!
それでは素敵なブログライフを!
サーバー選びに迷ったらエックスサーバーがおすすめ!
![](https://www19.a8.net/0.gif?a8mat=3TNR2M+BBTYXM+CO4+65ME9)