ブログ記事を書いていて、
「もう少し会話っぽくしたい」
「読みやすさを工夫したい」
そんなときに役立つのが AFFINGER6の「会話ふきだし」 です。
AFFINGERの標準機能だけで手軽に会話形式を表現できるので、レビュー記事や解説記事に取り入れると、読みやすさがアップします。
この記事では、
- 2種類のふきだしの違いと使い分け方
- 設定方法とカスタマイズ手順
- 実際に記事に挿入する方法
を順番に解説していきます。
さらに後半では、応用的な活用アイデアもまとめていますので、ぜひ参考にしてください。
2種類ある「ふきだし」の使い分け
AFFINGER6に標準搭載されているふきだしは、次の2種類です。
- 会話ふきだしブロック
- 段落スタイルの簡易会話
「どっちを使えばいいの？」と迷う人も多いと思いますが、実際には用途によって選び分けるのがおすすめです。
機能の違い
| 項目 | 会話ふきだしブロック | 簡易会話 |
|---|---|---|
| 名前の表示 | ○ | ✕ |
| 向きの変更 | ○ | ✕ |
| テキストの改行 | ○ | ✕ |
| アイコンの選択 | 8種類 | 2種類 |
| ドロップシャドウ | ✕ | ○ |
| ふきだしのボーダー | ○ | ✕ |
どちらを選ぶべき？
- 会話ふきだしブロック
- 名前を出したり、改行を入れたりして「会話らしさ」をしっかり表現したいときに便利。
→ レビュー記事やストーリー仕立ての記事と相性抜群です。
- 名前を出したり、改行を入れたりして「会話らしさ」をしっかり表現したいときに便利。
- 簡易会話
- 一言コメントを入れるときにサッと使える。
→ 影がつけられるので、ちょっとした補足や注意点を引き立てたいときにぴったりです。
- 一言コメントを入れるときにサッと使える。
私自身も最初はどちらを使うべきか迷いましたが、使い分けを明確にすることで、記事の書きやすさが変わりました。
AFFINGER6のふきだし設定手順
ふきだしは「AFFINGER管理」と「カスタマイズ」の2か所で設定できます。
設定しておくと、記事執筆のときにすぐ呼び出せるので便利です。
設定でできること（一覧）
- アイコンを追加（最大8個まで）
- アイコンを動かす／大きさを変える
- アイコンに枠線をつける
- ふきだしの色を変える
- ドロップシャドウをつける（簡易会話のみ）
ここからは代表的なカスタマイズを順番に紹介します。
「まずはこの基本を押さえておけばOK」という内容に絞って解説します。
＜AFFINGER管理＞ アイコンを設定する
- 「AFFINGER管理」→「会話アイコン」を開く
- 「アップロード」をクリックするとエクスプローラーが開くので、アイコンにする画像をアップロードする
- すると下の写真のように画像のURLが自動で挿入されます
サイトの雰囲気に合わせたキャラクターや顔写真を入れると、一気に親しみやすくなるで～！
＜AFFINGER管理＞ アイコンを少し動かす
「AFFINGER管理」→「会話アイコン」設定ページの一番下にある「会話アイコンを少し動かす」にチェックを入れて保存する。
これだけで、アイコンが「ぽよよん」と揺れて動きます。
レビュー記事で感情を表現したいときなどに効果的です。
＜AFFINGER管理＞ アイコンを大きくする
会話アイコンの「デフォルト」と「大」では以下ぐらい差があります。
「会話アイコンを少し大きく」にチェックを入れるだけでOKです。
メインキャラクターの発言を強調したいときにおすすめ！
＜カスタマイズ＞ アイコンのボーダーやふきだしの背景色を変える
「カスタマイズ」にて、アイコン周りのボーダーの有無や、ふきだしの背景色を変更できます。
「外観」→「カスタマイズ」→「オプション（その他）」→「会話ふきだし」を開く。
アイコン周りのボーダーの有無や、ふきだしの背景色はここで変更できます。
記事全体のデザインに合わせて、配色を統一すると読みやすさアップ。
＜AFFINGER管理＞ ドロップシャドウを追加する
ドロップシャドウとは、ふきだしに影を付けて立体的にする効果のことです。
違いは以下の画像のような感じになります。
シンプルに見せたい場合はOFF、目立たせたい場合はONにするとメリハリが出ます。
ドロップシャドウが有効なのは、簡易会話のみ。会話ふきだしには適応できません。
＜手順＞
- 「AFFINGER管理」→「全体設定」を開く
- 「ドロップシャドウ」の項目で、「以下の要素にドロップシャドウを追加します」にチェックを入れる
これでドロップシャドウが適応されます。
ちなみに、会話ふきだしにもドロップシャドウを追加する方法はあります。
詳しい情報は以下の記事をチェックしてください。
ふきだしの使い方（挿入手順）
ふきだしを記事に入れる方法は大きく分けて2種類あります。
ここでは「簡易会話」と「会話ふきだしブロック」それぞれの挿入手順を解説します。
簡易会話の使い方
- 新しい段落を追加
- 段落ブロックのスタイルから「簡易会話A」または「簡易会話B」を選択
- 以下の画像のような形でふきだしスタイルが挿入されます
※編集画面ではふきだしの形をしていませんが、プレビュー画面を見るとちゃんとふきだしとして表示されます。
- このふきだしの中にセリフを入力する
- プレビュー画面を確認すると、以下のようなふきだしになっています
一言コメントをサッと入れるときに便利！
注意点や補足を短く目立たせたいときに向いています。
会話ふきだしブロックの使い方
- 新しい段落に「/ふきだし」と入力、または「
」から会話ふきだしブロックを選択
- 登録済みのアイコン（最大8種類）から使用したいものを選ぶ
- ふきだしにセリフを入力します
※Enterを押せば、ふきだし内で改行できます。
名前を表示したり改行を入れたりできるので、レビュー記事や掛け合い風の演出に最適です。
アイコンを右に配置する方法
会話ふきだしブロックでは、設定画面の「向き」を切り替えるだけでアイコンを右側に移動できます。
読者の目線を動かす効果があるので、会話のテンポを出したいときにおすすめですよ！
応用的なふきだしの活用アイデア
基本の使い方に慣れてきたら、ちょっと工夫するだけで記事の見せ方が大きく変わります。
ここでは、実際に私が取り入れている応用的な使い方を紹介します。
CTA（行動喚起）の前に使う
「これ欲しい！」と思ったときに、ふきだしを1つ挟むとクリック率が上がることがあります。
例
この商品って本当に便利なの？
実際に使ってみたらこうでした！
その流れでCTAボタンを置くと自然に導線を作れます。
商品レビューを掛け合い形式にする
レビュー記事では「良い点」「気になる点」を会話風にすると、堅苦しくなく伝わります。
例
デザインが自由自在！
でも、最初は少し操作に慣れが必要だね
読者がイメージしやすくなります。
アンケート風の表現にする
吹き出しを左右に交互に配置するだけで、賛成派・反対派の意見を並べることができます。
簡易会話の影つきデザインを使うと、より見やすくなります。
オリジナルキャラクターアイコンを使う
Canvaやイラスト素材を活用して、自分だけのキャラクターを作るのもおすすめです。
サイトの世界観を統一でき、固定読者がつきやすくなります。
よくある質問（FAQ）
ふきだし内で改行できないときは？
簡易会話は改行できません。改行したい場合は「会話ふきだしブロック」を使いましょう。
Enterキーで自由に改行できます。アイコンを右側にしたいときは？
会話ふきだしブロックなら「向き」を切り替えるだけで右側に配置可能です。
簡易会話では右寄せできません。アイコンはいくつまで設定できる？
デフォルトで8種類まで設定できます。
サイト運営で十分な数なので、キャラ分けや状況に応じて使い分けましょう。アイコンを中央に配置できる？
デフォルトでは中央寄せはできません。
中央配置したい場合はカスタムCSSで調整が必要です。アイコンの推奨サイズは？
100×100px程度が見やすく、ふきだしに収まりやすいです。
あまり大きすぎるとレイアウトが崩れるので注意しましょう。もっと自由にふきだしを使いたいときは？
標準機能だけでも十分ですが、さらに細かい設定をしたい方は 「会話ふきだしPro」 の導入がおすすめです。
アイコンやデザインのバリエーションが増えるので、レビュー記事やキャラクターを使った記事に特に向いています。
まとめ
AFFINGER6のふきだし機能は、記事に会話のテンポや読みやすさを加えるのに最適です。
- 基本機能：
会話ふきだしブロックと簡易会話を使い分け - 設定方法：
AFFINGER管理とカスタマイズで色・サイズ・影を調整 - 応用活用：
CTA前の一言やレビュー掛け合い、アンケート風、オリジナルキャラの導入
これらを組み合わせれば、あなたのブログ記事はもっと親しみやすく、読まれるコンテンツになります。
さらに「もっと自由にデザインしたい！」という方は、会話ふきだしPro の導入も検討すると、アイコンや表現の幅がぐっと広がります。
関連記事もチェック！
吹き出しの工夫とあわせて他の機能も活用すれば、収益改善のヒントがきっと見つかりますよ。
