「段落」「ボックス」「リスト」ブロックの使い方｜ブロックエディタ Cocoon編

ブロックパーツにはいろいろな種類のものがありますが、中でも「段落」ブロックは一番使用頻度の高いブロックになります。

今回は、この「段落」ブロックと、段落ボックスを装飾する際の「ボックスブロック」、さらに箇条書きに良く使われる「リスト」ボックスについて説明します。

段落ブロック

段落ブロックは、ブログを書く際には一番よく使用されるブロックです。

単純に文字を入力するだけでなく、装飾したい場合は文字の色を変えたり、太さを変えたり、マーカーを引いたりできます。一段落ごとに色や太さを変えたり、文字ごとに装飾を変えたりできます。

装飾には、上部に表示される「編集バー」や、右側に表示される「ブロックメニュー」内の項目を設定して行います。

さらに文章を目立たせたい場合は、ボックスブロックと共に使用することもできます。（Cocoonの場合）。

ボックスブロック

Cocoonのボックスブロックは５種類

Cocoonには５つのボックスブロックがあります。

装飾の違いはありますが、エディタ上での設定方法は同じです。

「ボックスブロック」の挿入方法

次は、ボックスブロックの挿入方法を説明します。

リストブロック

次は、リストブロックについて説明します。

Cocoonのテーマを使用している場合、リストブロックには、２つの種類があります。

エディタ付属の「リスト」ブロックは、ブロックリストの上部にあります。これは、使用しているWordPressテーマに依存していない、もともと付いているブロックになります。

もう一つは、WordPressテーマCocoonに付属の「アイコンリスト」ブロックです。

この２つの違いは、エディタ付属の「リスト」ブロックにはあまり装飾がなく、Cocoon付属の「アイコンリスト」ブロックの方が、凝った装飾ができるという点です。

まず最初に、ブロックエディタ付属の「リスト」ブロックの使い方について説明します。

①ブロックエディタ付属の「リスト」ブロック

エディタ付属のリストボックスでは、

• ビュレットリスト
• 数字リスト

の２つを作ることができます。

ビュレット（・）はエディタでは表示されませんが、実際は表示されます。ビュレットリストも数字リストも、リスト項目を１段下げて「子項目」を作ることができます。

右側のメニューの設定項目は多くありません。

②Cocoonの「アイコンリスト」ブロック

次は、Cocoonの「アイコンリスト」ブロックについて説明します。

Cocoonの「アイコンリスト」ブロックでは、トップのビュレットの形や色を選んだり、タイトルを入れたりできます。

さらに、周りにボーダーを付けたり、背景色を付けたりできます。

ただし、「ボックス」ブロック同様、子ブロックを選択していると、全体の装飾ができません。全体を装飾したいときは、必ず親ブロックを選択してください。

今回は、「段落」「ボックス」「リスト」の基礎的なブロックについて解説しました。

---

次の記事では、装飾に必須の「見出し」や「画像」ブロックの使い方について説明します。