【初心者向け】AFFINGER６リストブロックの使い方～１６種類のスタイルに変更可能

リストブロックの使い方

記事を書く上でリストは便利でよく利用する機能です。

リストを利用することで、読んでいる方にとっても見やすい記事を作成することができます。

リストを作成するにはブロックの「リスト」を選択するだけです。

「リストを選択」（下画像の矢印部分）をクリックすると画面右側にスタイル変更などができる設定画面が表示されます。

設定画面でリストのスタイル（デザイン）やボーダー設定、テキスト色や背景色の変更などができるので詳しく説明していきます。

AFFINGER６で可能なリストのデザイン（１６種類）

AFFINGER６では１６種類のスタイルから選んで簡単にリストデザインを変更することができます。

※　「AFFINGERブロック」プラグインのバージョン2.9.1より以前だと１２種類になります。

• デフォルト
• 点線
• サークル
• サークル+点線
• チェックB
• チェックB+点線
• チェックL
• 連番C
• 連番S
• 連番S+点線
• タイムラインL
• タイムラインC
• 階層
• 米印
• マル
• バツ

１．デフォルト

何もしない初期のリストです。

• ああああ
• いいいい
• うううう

２．点線

下部に点線を表示させることができるリストです。

• ああああ
• いいいい
• うううう

３．サークル

マルを表示させることができるリストです。

マルの部分の色は変更することができますが、サイト全体で利用するリストに反映されるので個別で変更することはできません。

変更方法は記事の後半で解説しています。

• ああああ
• いいいい
• うううう

４．サークル+点線

マルと下部に点線を表示させることができるリストです。

• ああああ
• いいいい
• うううう

５．チェックB

チェックリスト表示です。

• ああああ
• いいいい
• うううう

６．チェックB+点線

チェックリストで下部に点線を表示させることができるリストです。

• ああああ
• いいいい
• うううう

７．チェックL

丸形のチェックリストです。

• ああああ
• いいいい
• うううう

８．連番C

丸形の連番リストです。

• ああああ
• いいいい
• うううう

９．連番S

四角型の連番リストです。

• ああああ
• いいいい
• うううう

１０．連番S+点線

四角型の連番リストで下部に点線を表示させることができるリストです。

• ああああ
• いいいい
• うううう

１１．タイムラインL

タイムライン風のリストです。

1. ああああ
   • いいいい
2. うううう

１２．タイムラインC

番号付きタイムライン風のリストです。

• ああああ
  • いいいい
• うううう

１３．階層

階層構造のリストを作成できます。

• ああああ
  • いいいい
    • うううう
  • ええええ

１４．米印

米印付のリストです。

• ああああ
• いいいい
• うううう

１５．マル

マル付きのリストです。

• ああああ
• いいいい
• うううう

１６．バツ

バツ付きのリストです。

• ああああ
• いいいい
• うううう

リストのボーダー設定

作成したリストに枠線（ボーダー）を設定することができます

設定できる種類は５種類になります。

• なし
• 基本
• 太め
• 点線
• 点線（太め）

• ボーダー設定「なし」だとこんな感じです。

• ボーダー設定「基本」だとこんな感じです。

• ボーダー設定「太め」だとこんな感じです。

• ボーダー設定「点線」だとこんな感じです。

• ボーダー設定「点線（太め）」だとこんな感じです。

リストの色設定

リストのテキスト色や背景色を変更できます。

• テキスト色を赤に変更するとこんな感じです。

• 背景色を変更するとこんな感じです。

リストのタイポグラフィ設定

タイポグラフィとは簡単に言えば、書かれた文字や文章を見やすくする技術のことです。

私はほぼ設定することはないですが、スマホなどの実際の表示を確認してみて見にくいと感じる場合は設定してみてもいいかもしれません。

• サイズ「S」だとこんな感じです。

• サイズ「M」だとこんな感じです。

• サイズ「L」だとこんな感じです。

• サイズ「XL」だとこんな感じです。

リストのマルやチェック部分の色を変更する方法

リストのマルやチェック部分の色は「外観」→「カスタマイズ」→「オプション（その他）」→「リスト（数字・チェック/ボックスタイプ）から変更可能です。

注意として、サイト全体での設定となるので作成した全てのリストに適用されます。

以上がAFFINGER６のリストブロックの使い方になります。

リスト機能を利用することで読み手の方に見やすく解りやすい記事を作成することができます。

見やすい記事・解りやすい記事を作成することはブログの収益化にも直結してきます。

収益化に繋げる為の記事の書き方について、初心者向けにテクニックを紹介した別記事も参考にしてみてください。

稼げるブログにする為のブログの書き方

ブログで稼ぐ為に一番重要なブログ文章術 稼げるブログを作成するのに一番重要なことは 読み手の方によりそって読み手の方目線で文章を書くことです。 ブログで収益を得る為には広告をクリックしてもらったり、広 ...

AFFINGER6の使い方

AFFINGER6の使い方については、このブログで詳しく解説しています。

AFFINGER6：関連記事