WP5.3で検証

リスト

デフォルト表示

箇条書きリスト

  • 項目1
  • 項目2
    • 項目2-1
      • 項目2-1-1
      • 項目2-1-2
    • 項目2-2
    • 項目2-3
  • 項目2
<div class="entry-content">
	<ul>
		<li>項目1</li>
		<li>項目2
			<ul>
				<li>項目2-1
					<ul>
						<li>項目2-1-1</li>
						<li>項目2-1-2</li>
					</ul>
				</li>
			<li>項目2-2</li>
			<li>項目2-3</li>
		</ul>
		</li>
		<li>項目2</li>
	</ul>
</div>

番号付きリスト

  1. 項目1
  2. 項目2
    1. 項目2-1
      1. 項目2-1-1
      2. 項目2-1-2
    2. 項目2-2
    3. 項目2-3
  3. 項目2
<div class="entry-content">
	<ol>
		<li>項目1</li>
		<li>項目2
			<ol>
				<li>項目2-1
					<ol>
						<li>項目2-1-1</li>
						<li>項目2-1-2</li>
					</ol>
				</li>
				<li>項目2-2</li>
				<li>項目2-3</li>
			</ol>
		</li>
		<li>項目2</li>
	</ol>
</div>

ブロック設定パネル

番号付きリストの場合、初期値と逆順設定

サンプル(9から逆順)

  1. 項目1
  2. 項目2
  3. 項目3
<ol reversed="" start="9">
	<li>項目1</li>
	<li>項目2</li>
	<li>項目3</li>
</ol>

スタイル設定

標準スタイル

標準スタイル無し

例)追加スタイルサンプル

.entry-content > ul,
.entry-content > ul ul,
.entry-content > ol,
.entry-content > ol ol {
	margin-left: 2px;
	padding-left: 16px;
}
.entry-content > ol,
.entry-content > ol ol {
	margin-left: 8px;
}
.entry-content > ul
.entry-content > ol {
	margin-bottom: 16px;
}
.entry-content > ul li,
.entry-content > ol li {
	margin: 4px 0;
	font-size: 1.6rem;
	line-height: 1.5;
}

ギャラリーブロックなどもulタグのため、.entry-content ulではなく、.entry-content > ulで指定。

ブロック制御コメント

<!-- wp:list -->
<!-- /wp:list -->

<!-- wp:list {"ordered":true} -->
<!-- /wp:list -->

<!-- wp:list {"ordered":true,"start":9,"reversed":true} -->
<!-- /wp:list -->