【アフィンガー5】吹き出し機能の設定から使い方まで徹底解説

【アフィンガー5】吹き出し機能の設定から使い方まで徹底解説

2020年5月21日

AFFINGER5の吹き出し機能ってどうやって使うの?設定方法と使い方を教えて!

 

このような疑問にお答えします。

 

✓本記事の執筆者

かずきの武器庫運営者

Twitter:かずき(@k03mind)

 

吹き出し機能はプラグインを使うことが常識でしたが、AFFINGER5では導入した時点で実装されています。

 

わざわざプラグインを入れなくても済むので、セキュリティーや表示速度向上に繋がります

 

しかし、設定方法や使い方に悩まれて、使いこなせない人が多いのが現状。

 

ということで今回は、AFFINGER5の吹き出し機能の設定から使い方までを徹底的に解説していきます。

 

kazuki
本記事を読めば吹き出し機能を使いこなせること間違いなしですよ。

 

また、最後には吹き出し機能を使う際の注意点も解説します。そちらもお忘れなく!

 

本記事はすでにAFFINGER5を購入している人向けの記事です。もし、まだ購入されていないのであれば、下記の記事をどうぞ☟

購入特典

当サイト経由でAFFINGE5をご購入いただけますと、購入者限定特典として6つの特典をプレゼントします。

>>AFFINGER5購入特典についてはこちら

 

AFFINGER5(アフィンガー)吹き出し機能の設定方法

AFFINGER5(アフィンガー)吹き出し機能の設定方法

  1. 吹き出しに使えるアイコンの調達
  2. 吹き出しアイコンの設定
  3. 吹き出しの色のカスタマイズ

 

吹き出し機能の設定は、上記の3ステップで完了です。1つずつ解説していきますね。

 

1.吹き出しに使えるアイコンの調達

 

まずは吹き出しに使うアイコンの調達から。今回は無料、有料でおすすめの調達方法をまとめました☟

 

  • 無料:Charat
  • 有料:ココナラ

 

それぞれ解説していきます。

 

無料ならCharat

無料ならCharat

 

無料で一番おすすめするならCharatですね。かわいいアイコンを作り放題です。

 

ただ、注意点が一つありまして、それは利用者が多いという点。

 

アイコンはサイト運営者の顔になるので、ブロガーにとっては大切にしておきたいところ。

 

kazuki
しっかり覚えてもらえるアイコンを使っておきたいですよね。。。

 

最初は無料のCharatでもいいと思いますが、ゆくゆくは自分だけのオリジナルアイコンを使いましょう。

 

オリジナルアイコンについては次で解説します。

 

有料ならココナラ

有料ならココナラ

 

有料でアイコンを調達するならココナラがおすすめ。

 

取引がスムーズに行えるだけでなく、絵師さんによっては納得いくまで何度でも書き直してくれる人もいます。

 

非常に有名なサイトですし、詐欺などの心配をすることもないのでおすすめですよ。

>>ココナラで似顔絵を描いてもらう

 

2.吹き出しアイコンの設定

 

吹き出しアイコンはAFFINGER5管理画面から設定します。

 

まずはWordPress管理画面から「AFFINGER5管理」→「会話・ファビコン等」をクリックし、「会話風アイコン」を探してください。

 

アフィンガー5の管理画面

 

見つかりましたら、下記3点の設定です。

 

  • アイコン名:表示したい名前を入力
  • 画像のURL:表示したい画像のURL
  • アップロード:画像をアップロード

 

アフィンガー5の会話吹き出しの設定

 

設定が完了すると、こんな感じで表示できるようになります。

 

kazuki
こんにちわ!

 

また、他にもこんな設定が。

 

アフィンガー5の会話吹き出しの設定画面

 

  • 会話風アイコンを少し動かす
  • 会話風アイコンを少し大きく

 

上記2点はお好みで設定してください。

 

kazuki
僕は"会話風アイコンを少し大きく"にチェックを入れています!

 

3.吹き出しの色のカスタマイズ

 

吹き出しの色はカスタマイズ画面から変更できます。

 

デフォルトでも使えますが、変更したい人も多いと思うので解説します。

 

まずは、WordPress管理画面から「外観」→「カスタマイズ」の順でクリック。

 

ワードプレスの管理画面

 

そこから「オプションカラー」→「会話風吹き出し」の順でクリック。そこで好きな色に変更できます。

 

ワードプレスのカスタマイズ画面

会話吹き出しのカスタマイズ

 

また、色だけでなくちょっとしたカスタマイズも可能です。

 

カスタマイズできる箇所は下記の4点☟

 

  • 会話1~会話2までの会話背景色の設定
  • アイコンの枠線を消す
  • 吹き出しを角丸にしない
  • ボーダーデザインタイプ(2px)に変更

 

好きにカスタマイズしてもらっていいのですが、今回は僕が使っているおすすめの設定方法を教えます☟

 

  • 背景色:#333333
  • アイコンの~:チェックしない
  • 吹き出しを~:チェックしない
  • ボーダーライン~:チェック

(「ボーダーデザインタイプ(2px)に変更」にチェックを入れることで、各会話アイコンの背景色の色がボーダーの色に反映されるようになります。)

 

個人的に一番好きなカスタマイズで、次のように表示されます。

 

kazuki
こんな感じで表示されますよ!

 

お好みでカスタマイズしてもいいですが、どんな風にしたらいいかわからない人はマネしてOKです。

 

 

以上、AFFINGER5の吹き出し機能の設定でした。

 

これですぐにでも吹き出し機能を使うことができます。

 

使い方が分からないです。。。

 

大丈夫。次で詳しく解説します!
kazuki

 

AFFINGER5(アフィンガー)吹き出し機能の使い方

AFFINGER5(アフィンガー)吹き出し機能の使い方

  1. 吹き出しの出力方法
  2. 吹き出しの反転方法

 

使い方は上記の2点だけ。簡単なのでさくっと解説します。

 

1.吹き出しの出力方法

 

設定した吹き出しアイコンの出力は非常に簡単。

 

記事編集画面で、「タグ」→「会話ふきだし」の順でクリック。

 

すると、次のように会話1~8を選択することができます。

 

アフィンガー5の会話吹き出しの出力方法

 

ここからは僕の「会話1」で設定している吹き出し会話を使って説明します。

 

まずは会話1をクリック。すると、次のようなコードが表示されます。

会話吹き出しのショートコード

カッコの間に文字を入力すると、会話風吹き出しの完成。

 

実際に文字を入力してみます。すると、吹き出しは次のように表示されます☟

 

kazuki
ヤッホー!

 

非常に簡単ですね。

 

ここまで長々と解説しましたが、やることは次の3つだけ。

 

吹き出しの出力

  1. タグをクリック
  2. 会話ふきだしをクリック
  3. 吹き出しで表示したい文を入力

 

2.吹き出しの反転方法

 

続いては吹き出しの反転方法について。これができれば吹き出しで会話しているように使えます。

 

kazuki
やっほー!

 

喋りかけんなーーー!!

 

こんな感じにね。

 

さて、反転方法は次のように「半角スペース+r」を入力するだけ。

 

会話吹き出しの反転

 

するとこんな感じに表示されます☟

 

反転したったわー
kazuki

 

 

以上、AFFINGER5の吹き出し機能の使い方についてでした。

 

これであなたは吹き出しマスター。とは言え、注意点を理解しておかないと読みにくい記事が出来上がってしまいます。

 

注意点を知らない人のために、次の項で詳しく解説しますね。

 

【アフィンガー5】吹き出し機能の注意点

【アフィンガー5】吹き出し機能の注意点

  1. アイコンは多くても3種類まで
  2. アイコンの多用は避けよう

 

吹き出し機能の注意点は上記の2つ。1つずつ解説していきます。

 

1.アイコンは多くても3種類

 

多種多様な表情のアイコンを使っている人をよく見かけますが、多すぎるアイコンは逆に見栄えが悪いです。

 

理想は2種類。というのも、ブログ記事は"特定の一人に向けて書くもの"だから。

 

多すぎるアイコンは誰に向けた記事なのかわからなくなり、読者は迷います。

 

なので、用意するアイコンは"自分"と、"たった一人の読者"。これで十分です。

 

それでも2種類が少ないと感じるのであれば、多くても3種類までにしておきましょう。

 

kazuki
多すぎると見栄えが悪い!理想は2種類。多くても3種類にしましょう。

 

2.アイコンの多用は避けよう

 

アイコンの多用を避けるべき理由は、薄っぺらい記事になるから。

 

吹き出し機能を使うメリットは、日常的に使うLINEのように見せることができる点。

 

しかし、掛け合いで見せるにはどうしてもテンポが悪くなります

 

例えば次の通り☟

 

kazuki
アイコンの多用は避けるべき。

 

なんで?

 

kazuki
薄っぺらい記事になるからです。

 

そうなの?

 

kazuki
そうです。こんな感じで掛け合いで見せるとテンポが悪いんですよね。

 

ん~たしかにちょっと悪いかも。。。

 

このように、テンポが悪くなるんですよね。なので、テンポよく見せるために2ラリーまでにしておきましょう。

 

 

以上、吹き出し機能の注意点でした。

 

注意点を理解できたらもう怖いものなしです。吹き出し機能を使って記事執筆に取り掛かりましょう。

 

それでは最後にまとめです。

 

まとめ:AFFINGER5(アフィンガー)吹き出し機能で競合ブロガーと差をつけよう

まとめ:AFFINGER5(アフィンガー)吹き出し機能で競合ブロガーと差をつけよう

 

本記事では、AFFINGER5の吹き出し機能の設定方法や使い方、さらには注意点まで網羅的に解説しました。

 

全て読んで頂けたら吹き出し機能については完璧です。適切に吹き出し機能を利用し、競合ブロガーと差をつけましょう。

 

また、このようにAFFINGER5には便利な機能がたくさんあります。他の機能も知りたい人は、個別でまとめた記事があるので参考にしてください☟

 

 

それでは今日はこのへんで。グッバーイ

-affinger

© 2020 かずきの武器庫