前書き
WordPressでは記事を書く時、番号なしリストを使う事が多い。標準の画面では(白丸、黒丸、四角)の4種類しかない。
CSSを使い装飾すれば面倒だと思われる、そこで「ショートコードを挿入」を使い、おしゃれにしたい。
関連記事
標準の番号なしリスト例
- あああああああ
- いいいいいいい
- ううううううう
- えええええええ
番号なしリストをおしゃれに
上の「ショートコードを挿入」を押す。
一覧画面からリストを押す
次の画面から「アイコンピッカー」を押す、「アイコンの色」も変えられる。
アイコン一覧が出るので、アイコンを選ぶ、又 アイコンの色を選ぶ。
「ショートコードを挿入」を押す
その結果が次のようになった
- 並び項目
- 並び項目
- 並び項目
アイコンの色も変更可能
上記のソースコードは次のようになる
<p>[su_list icon="icon: check"]</p>
<ul>
<li>並び項目</li>
<li>並び項目</li>
<li>並び項目</li>
</ul>
<p>[/su_list]</p>
注意事項
リストの中に「画像」を入れた場合、リストマークがおかしくなる事が分かった。
(例)
リスト(並び項目2)の中に次の画像を入れてみる。
修正前
上記を「プレビュー」したら次のようになる。
- 並び項目1
- 並び項目2
- 並び項目3
修正後
- 並び項目1
- 並び項目2
- 並び項目3
不具合が直っている。