この記事には広告が含まれています。

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

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

この記事がお勧めな方

  • AFFINGER6のリストブロックの使い方を知りたい方
  • AFFINGER6でどんなリストが作成できるか知りたい方

リストブロックの使い方

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

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

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

WordPressリストブロック

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

リストの設定画面

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

AFFINGER6で可能なリストのデザイン(16種類)

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

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

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

1.デフォルト

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

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

2.点線

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

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

3.サークル

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

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

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

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

4.サークル+点線

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

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

5.チェックB

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

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

6.チェックB+点線

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

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

7.チェックL

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

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

8.連番C

丸形の連番リストです。

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

9.連番S

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

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

10.連番S+点線

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

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

11.タイムラインL

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

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

12.タイムラインC

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

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

13.階層

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

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

14.米印

米印付のリストです。

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

15.マル

マル付きのリストです。

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

16.バツ

バツ付きのリストです。

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

リストのボーダー設定

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

リストのボーダー設定画面

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

  • なし
  • 基本
  • 太め
  • 点線
  • 点線(太め)
  • ボーダー設定「なし」だとこんな感じです。
  • ボーダー設定「基本」だとこんな感じです。
  • ボーダー設定「太め」だとこんな感じです。
  • ボーダー設定「点線」だとこんな感じです。
  • ボーダー設定「点線(太め)」だとこんな感じです。

リストの色設定

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

リストの色設定画面
  • テキスト色を赤に変更するとこんな感じです。
  • 背景色を変更するとこんな感じです。

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

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

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

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

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

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

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

リスト(数字・チェック/ボックスタイプ)設定画面

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

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

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

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

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

関連記事

ブログの記事を書くのにAIライティングツールを利用すると効率を上げることができます。

ハムタ
ハムタ
パパくま
パパくま

現在は多くのAIライティングツールがあります。

そのほとんどが無料お試しでの利用が可能です。

お試し期間が限定のツールもありますが、中には機能制限はありますがずっと無料で利用できるツールもあります。

無料お試しがずっと可能なAIライティングツールをまとめてみたので、是非試してみてください。

関連記事
AFFINGER6で出来ること【まとめ】-AFFINGER6を徹底解説
AFFINGER6で出来ること【まとめ】-AFFINGER6を徹底解説

2025/2/9  

AFFINGER6を使ってみたい!気になる!という方向けに AFFINGER6ってどんなテーマ? AFFINGER6でどんなことができるの? AFFINGER6を使うにはどうすればいいの? といった内 ...

(通常版)AFFINGER6と(上位版)AFFINGER6 EXの違い【まとめ】
(通常版)AFFINGER6と(上位版)AFFINGER6 EXの違い【まとめ】

2024/11/28    

AFFINGER6を購入しようと検討している方や既に通常版のAFFINGER6を使用している方で、その違いが気になる方も多いと思います。 そこで、この記事では(通常版)AFFINGER6と(上位版)A ...

『SWELL』ってどうなの?-実際に利用したメリットとデメリットをガチレビュー!
『SWELL』ってどうなの?-実際に利用したメリットとデメリットをガチレビュー!

2024/11/28    

SWELLはとても人気の高いテーマです。 この記事はSWELLが気になる方向けにメリットとデメリットを紹介しています。 価格 17,600円(税込み) シンプル&高機能なWordPressテーマ! 最 ...

AFFINGER6は初心者が購入しても大丈夫?-初心者にお勧めの理由
AFFINGER6は初心者が購入しても大丈夫?-初心者にお勧めの理由

2024/11/28    

AFFINGER6を購入しようと思っている初心者の方は、解らないことが多いからこそ購入に対して不安を感じるかもしれません。 この記事は、実際に知識ゼロからAFFINGER6を使用した私が断言できる内容 ...

AFFINGER6の購入とインストール方法

AFFINGER6の購入方法と購入プランの選び方
【知っておくべき!】AFFINGER6の購入方法と購入プランの選び方-⑤種類から最適を選択!

2025/2/10    

AFFINGER6を使ってみたい! という方に ちょっと待ってください! AFFINGER6を購入する際には複数のプランが存在しますので、自分の取り組み方に合った購入方法を選択した方がお得に購入できま ...

AFFINGER6(アフィンガー6)のインストール方法【画像付き!詳細解説】
AFFINGER6(アフィンガー6)のインストール方法-初心者でも安心!購入プランから徹底解説!

2024/12/29    

初心者でも大丈夫! AFFINGER6の購入からインストールして使えるようにするまでの手順や注意点を詳しく解説しています。 AFFINGER6は「稼ぐ」に特化した有名ブロガーさんも多数利用するテーマで ...

AFFINGER6(アフィンガー6)EX版の購入とアップグレードの方法
AFFINGER6(アフィンガー6)EX版の購入とアップグレードの方法

2025/1/8    

この記事ではAFFINGER6の上位版である「AFFINGER6EX」へのアップグレード方法を解説しています。 AFFINGER6EX版にアップグレードする為の条件 AFFINGER6からEX版にアッ ...

AFFINGER6の設定関係

AFFINGER6導入後にまず何をしたらいいの?-初心者にお勧めの初期設定4項目
AFFINGER6導入後にまず何をしたらいいの?-初心者にお勧めの初期設定4項目

2024/10/17    

「ブログで稼ぎたい!」 って思いブログを始めた初心者の方も多いと思います。 収益化するには何より記事を作成しなければ話になりません。 この記事ではAFFINGER6を始めたばかりの初心者の方向けに、い ...

WordPressお勧めプラグイン【アフィンガー6】
AFFINGER6(アフィンガー6)にお勧めのプラグイン【初心者向け】

2024/12/29    

AFFINGER6にお勧めのプラグインを9つ紹介しています。 初心者の方は何を導入すればいいのか解らないと思いますので、是非参考にしてみてください。 プラグインとは? 「プラグイン」とはワードプレスを ...

AFFINGER6のアップデート方法(2パターンを解説)
AFFINGER6のアップデート方法(2パターンを解説)

2024/12/30    

この記事がお勧めな方 AFFINGER6のアップデート方法を知りたい方 AFFINGER6の手動でのアップデート方法が知りたい方 AFFINGER6で自動更新のお知らせを設定する方法を知りたい方 AF ...

AFFINGER6(アフィンガー6)でグーグルアナリティクスを導入する方法
AFFINGER6(アフィンガー6)でGoogleアナリティクスを導入する方法

2024/7/18    

ここではAFFINGER6(アフィンガー6)でGoogleアナリティクスを導入する方法を初心者向けに解説しています。 AFFINGER6(アフィンガー6)では簡単にGoogleアナリティクスを導入して ...

AFFINGER6:Googleサーチコンソールへの登録方法
AFFINGER6:Googleサーチコンソールへの登録方法

2024/12/14    

Googleサーチコンソールではあなたのサイトが「どんなキーワードで表示されたのか」を確認することができたり、あなたのサイトのページが「どれくらいインデックスされているか」などを調べることができます。 ...

AFFINGER6のステマ規制対策-広告表記を表示させる方法
AFFINGER6のステマ規制対策-広告表記を表示させる方法

2024/7/18    

この記事ではステマ規制対策としてAFFINGER6(アフィンガー6)で記事に「広告」表記を表示させる方法を解説しています。 ステマ規制とは2023年10月から開始された「ステルスマーケティング」に対す ...

AFFINGER6の使い方

AFFINGER6の使い方
AFFINGER6の使い方【まとめ】-初心者向けガイド-

2024/11/5    

この記事はAFFINGER6(アフィンガー6)の使い方を初心者向けに詳しく解説しています。 見出しの作成方法 記事作成の基本!見出し作成や見出しについての記事です。 カテゴリーの作成とカテゴリーページ ...

AFFINGER6のデザインカスタマイズ

AFFINGER6:カスタマイズ方法
AFFINGER6のカスタマイズ方法-初心者向けガイド-

2024/11/21    

この記事ではAFFINGER6のカスタマイズ方法を初心者向けに詳しく解説しています。 デザインカードプラグインでサイトデザインを変更する方法 プラグインでサイトデザインを簡単に変更できるようになりまし ...