エディタはGutenberg(グーテンベルグ)、テーマはCocoon
こちらはWordpress5.5の新エディタGutenberg(グーテンベルグ)を使用しての記事の書き方になります。 テーマはCocoonを使っています。
それでは具体的にご説明していきます。
ワードプレスCocoonの標準リスト表示
グーテンベルグエディタでのリストの出し方
リストのボタンは下の画像、ワードプレス投稿編集画面の左上か右横の〇(⊞マーク)を押して探します。

右上の⊞マークを押した場合

右横の⊞マークを押した場合

右の⊞をクリックすると上部にはよく使うものが表示されます。その中に“リスト”が入っていないときは、下に【すべて表示】の文字が出てくるのでそちらをクリックして“リスト”を探します。

リストのボタンの変え方

文字の前にくるマークをドット(・)にするか番号(1,2,3…)にするかは上の画像の〇で囲った部分で変更することができます。
ドットを使用したリストはこちら↓
- リスト
- リスト
番号を選択した時は下のように表示されます。
- リスト
- リスト
Cocoonリストのカスタマイズ方法
こちらの方法だとCSSを変更することなく
このようなアイコンに変更することができます。順番に見ていきましょう。
アイコンリストを選択
方法は簡単です。

⊞のマークを押してその中の“アイコンリスト”をクリックします。

すると上の画像のような状態になると思います。この状態で画面右側の“ブロック”エリアからアイコンを選んだり、アイコンの色を変えたりできます。色設定の下には枠の色や背景を設定できる場所もあります。
これらを組み合わせると、先ほどのようないろいろなリスト表示ができるようになります!
設定は以上です!
最後に1つ注意していただきたいこと
“アイコンリスト”を選択していても下のような状態にしかならない!(リストのカスタマイズができない!)ということが出てくるかと思います。

これは、リストの部分(下の画像の〇の部分)を選択してしまっているのが原因です。

〇の部分をクリックすれば、カスタマイズができる状態に戻ります。
さいごに
その他ワードプレスCocoonの設定方法はこちらです。分かりやすい説明を心がけています。
