デフォルト表示
箇条書きリスト
- 項目1
- 項目2
- 項目2-1
- 項目2-1-1
- 項目2-1-2
- 項目2-2
- 項目2-3
- 項目2-1
- 項目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
- 項目2
- 項目2-1
- 項目2-1-1
- 項目2-1-2
- 項目2-2
- 項目2-3
- 項目2-1
- 項目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
- 項目2
- 項目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 -->