
このような疑問にお答えします。
✔本記事の内容
- 吹き出し機能の設定方法
- 吹き出し機能の使い方
- 吹き出し機能の注意点
吹き出し機能はプラグインを使うことが常識でしたが、AFFINGER6では導入した時点で実装されています。わざわざプラグインを入れなくても済むので、セキュリティーや表示速度向上に繋がります。
しかし、設定方法や使い方に悩まれて、使いこなせない人が多いのが現状。
ということで今回は、AFFINGER6の吹き出し機能の設定から使い方までを徹底的に解説していきます。本記事を読めば吹き出し機能を使いこなせること間違いなしですよ。また、最後には吹き出し機能を使う際の注意点も解説します。そちらもお忘れなく!
目次
AFFINGER6(アフィンガー)吹き出し機能の設定方法
- 吹き出しに使えるアイコンの調達
- 吹き出しアイコンの設定
- 吹き出しの色のカスタマイズ
吹き出し機能の設定は、上記の3ステップで完了です。
1つずつ解説していきますね。
①吹き出しに使えるアイコンの調達
- 無料:Charat
- 有料:ココナラ
まずは吹き出しに使うアイコンの調達から。今回は無料、有料でおすすめの調達方法をまとめました。それぞれ解説していきます。
無料ならCharat
無料で一番おすすめするならCharatですね。かわいいアイコンを作り放題です。
ただ、注意点が一つありまして、それは利用者が多いという点。アイコンはサイト運営者の顔になるので、ブロガーにとっては大切にしておきたいところ。

最初は無料のCharatでもいいと思いますが、ゆくゆくは自分だけのオリジナルアイコンを使いましょう。オリジナルアイコンについては次で解説します。
有料ならココナラ
有料でアイコンを調達するならココナラがおすすめ。取引がスムーズに行えるだけでなく、絵師さんによっては納得いくまで何度でも書き直してくれる人もいます。
非常に有名なサイトで詐欺などの心配をすることもないのでおすすめですよ。
②吹き出しアイコンの設定
吹き出しアイコンはAFFINGER6管理画面から設定します。
まずはWordPress管理画面から「AFFINGER6管理」→「会話・ファビコン等」をクリックし、「会話風アイコン」を探してください。(※画像はAFFINGER5ですが、内容は同じです)
見つかりましたら、下記3点の設定です。
- アイコン名:表示したい名前を入力
- 画像のURL:表示したい画像のURL
- アップロード:画像をアップロード
設定が完了すると、こんな感じで表示できるようになります。

また、他にもこんな設定が。
- 会話風アイコンを少し動かす
- 会話風アイコンを少し大きく
上記2点はお好みで設定してください。

③吹き出しの色のカスタマイズ
吹き出しの色はカスタマイズ画面から変更できます。デフォルトでも使えますが、変更したい人も多いと思うので解説します。
まずは、WordPress管理画面から「外観」→「カスタマイズ」の順でクリック。
そこから「オプションカラー」→「会話風吹き出し」の順でクリック。
そこで好きな色に変更できます。
また、色だけでなくちょっとしたカスタマイズも可能です。
カスタマイズできる箇所は下記の4点。
- 会話1~会話2までの会話背景色の設定
- アイコンの枠線を消す
- 吹き出しを角丸にしない
- ボーダーデザインタイプ(2px)に変更
好きにカスタマイズしてもらっていいのですが、今回は僕が使っているおすすめの設定方法を教えます。
- 背景色:#333333
- アイコンの~:チェックしない
- 吹き出しを~:チェックしない
- ボーダーライン~:チェック
(「ボーダーデザインタイプ(2px)に変更」にチェックを入れることで、各会話アイコンの背景色の色がボーダーの色に反映されるようになります。)
個人的に一番好きなカスタマイズで、次のように表示されます。

お好みでカスタマイズしていいですが、どんな風にしたらいいかわからない人はマネしてOK。
以上、吹き出し機能の設定でした。これですぐにでも吹き出し機能を使うことができます。

次で詳しく解説します!

AFFINGER6(アフィンガー)吹き出し機能の使い方
- 吹き出しの出力方法
- 吹き出しの反転方法
使い方は上記の2点だけ。
簡単なのでさくっと解説します。
①吹き出しの出力方法
設定した吹き出しアイコンの出力は非常に簡単。記事編集画面で、「タグ」→「会話ふきだし」の順でクリック。
すると、次のように会話1~8を選択することができます。
ここからは僕の「会話1」で設定している吹き出し会話を使って説明します。
まずは会話1をクリック。すると、次のようなコードが表示されます。
カッコの間に文字を入力すると、会話風吹き出しの完成。
実際に文字を入力してみます。すると、吹き出しは次のように表示されます。

非常に簡単ですね。
ここまで長々と解説しましたが、やることは次の3つだけ。
吹き出しの出力
- タグをクリック
- 会話ふきだしをクリック
- 吹き出しで表示したい文を入力
②吹き出しの反転方法
これができれば吹き出しで会話しているように使えます。


こんな感じにね。
さて、反転方法は次のように「半角スペース+r」を入力するだけ。
すると、こんな感じに表示されます。

以上、AFFINGER6の吹き出し機能の使い方についてでした。
これであなたは吹き出しマスター。とは言え、注意点を理解しておかないと読みにくい記事が出来上がってしまいます。
注意点を知らない人のために、次の項で詳しく解説しますね。
AFFINGER6(アフィンガー)吹き出し機能の注意点
- アイコンは多くても3種類まで
- アイコンの多用は避けよう
吹き出し機能の注意点は上記の2つ。1つずつ解説していきます。
①アイコンは多くても3種類
多種多様な表情のアイコンを使っている人をよく見かけますが、多すぎるアイコンは逆に見栄えが悪いです。
理想は2種類。というのも、ブログ記事は"特定の一人に向けて書くもの"だから。
多すぎるアイコンは誰に向けた記事なのかわからなくなり、読者は迷います。
なので、用意するアイコンは"自分"と、"たった一人の読者"。これで十分です。
それでも2種類が少ないと感じるのであれば、多くても3種類までにしておきましょう。
②アイコンの多用は避けよう
アイコンの多用を避けるべき理由は、薄っぺらい記事になるから。
吹き出し機能を使うメリットは、日常的に使うLINEのように見せることができる点。
しかし、掛け合いで見せるにはどうしてもテンポが悪くなります。
例えば次の通り。






このように、テンポが悪くなるんですよね。
なので、テンポよく見せるために2ラリーまでにしておきましょう。
以上、吹き出し機能の注意点でした。
注意点を理解できたらもう怖いものなしです。吹き出し機能を使って記事執筆に取り掛かりましょう。
まとめ:AFFINGER6(アフィンガー)吹き出し機能で競合ブロガーと差をつけよう
本記事では、AFFINGER6の吹き出し機能の設定方法や使い方、さらには注意点まで網羅的に解説しました。
全て読んで頂けたら吹き出し機能については完璧です。適切に吹き出し機能を利用し、競合ブロガーと差をつけましょう。
また、当サイトでは本記事のようにアフィンガー6に関する記事をまとめております。
気になるものがあれば読んでみてください。
-
【アフィンガー6 JET】評価、導入・カスタマイズ方法【すべて語る】
続きを見る
-
AFFINGER6(アフィンガー)がSEOに強いと言われる5つの理由
続きを見る
-
【初心者向け】AFFINGER6の使い方【絶対に使う機能6選】
続きを見る
-
[コピーOK]AFFINGER6でトップページをカスタマイズする手順
続きを見る
-
【最短5分】AFFINGER6(アフィンガー)の初期設定を徹底解説
続きを見る
-
AFFINGER6(アフィンガー)のブログカードの作り方。2秒で作れます。
続きを見る
-
AFFINGER6のランキング作成手順を徹底解説
続きを見る
-
【超おしゃれ】AFFINGER6のスライドショーの設定方法と使い方
続きを見る
-
【徹底解説】AFFINGER6で目次を作る方法3選
続きを見る
気になるものがあれば読んでみてください。
それでは今日はこのへんで。グッバーイ