リスト

Posted: 2019/12/6 Updated: 2020/6/9

内部ブロック名：core/list

ブロックの選択方法

入力欄の横にある[+]マークをクリックして、「一般ブロック」から「リスト」をクリックします。

段落ブロックで書いていても、あとからブロックタイプを変更することができます。

デフォルト

箇条書きリスト

リストのインデントはツールチップから選択できます。

  • リストです
  • リストです
    • リストの入れ子もできます
  • リストです 
<ul>
	<li>
		リストです
	</li>
	<li>
		リストです
		<ul>
			<li>
				リストの入れ子もできます
			</li>
		</ul>
	</li>
	<li>
		リストです
	</li>
</ul>

番号付きリスト

ツールチップから番号付きリストに変更できます。

  1. リストです
  2. リストです
    1. リストの入れ子のできます
  3. リストです 
<ol>
	<li>
		リストです
	</li>
	<li>
		リストです
		<ol>
			<li>
				リストの入れ子のできます
			</li>
		</ol>
	</li>
	<li>
		リストです
	</li>
</ol>

箇条書きと番号付きの混在リスト

  • リストです
    1. リストの入れ子（番号付きリスト）
    2. リストの入れ子
  • リストです 
<ul>
	<li>
		リストです
		<ol>
			<li>
				リストの入れ子（番号付きリスト）
			</li>
			<li>
				リストの入れ子
			</li>
		</ol>
	</li>
	<li>
		リストです
	</li>
</ul>

その他

ツールチップ内では、配置の他に太字や打ち消し線なども設定することができます。

  • 太字 や イタリック を使用できます。
  • リンクも設定 できます。 新しいタブで開きます 。
  • インラインコード を使用できます。
  • 打ち消し線 を使用できます。
  • インライン画像を使用できます。 
<ul>
	<li>
		<strong>
			太字
		</strong>
		や
		<em>
			イタリック
		</em>
		を使用できます。
	</li>
	<li>
		<a href="/common-blocks/">
			リンクも設定
		</a>
		できます。
		<a rel="noreferrer noopener" aria-label="新しいタブで開きます (新しいタブで開く)" href="/common-blocks/" target="_blank">
			新しいタブで開きます
		</a>
		。
	</li>
	<li>
		<code>
		インラインコード
	</code>
	を使用できます。
</li>
<li>
	<s>
		打ち消し線
	</s>
	を使用できます。
</li>
<li>
	インライン画像を使用できます。
	<img class="wp-image-107" style="width: 150px;" src="/wp-content/uploads/2019/12/inline.jpg" alt="">
</li>
</ul>