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

【AFFINGER6】吹き出し機能の設定から使い方まで徹底解説

2020年5月21日

 

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

 

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

 

本記事の内容

  • 吹き出し機能の設定方法
  • 吹き出し機能の使い方
  • 吹き出し機能の注意点

 

吹き出し機能はプラグインを使うことが常識でしたが、AFFINGER6では導入した時点で実装されています。わざわざプラグインを入れなくても済むので、セキュリティーや表示速度向上に繋がります

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

 

ということで今回は、AFFINGER6の吹き出し機能の設定から使い方までを徹底的に解説していきます。本記事を読めば吹き出し機能を使いこなせること間違いなしですよ。また、最後には吹き出し機能を使う際の注意点も解説します。そちらもお忘れなく!

 

  • この記事を書いた人

kazuki

【実績】最高月15,000PV&収益34万円 | 当サイトでは超初心者向けのブログ情報や、僕も使っている厳選したおすすめのブログツールを紹介します。"ブログで稼ぎたい"と考えている人に最適な情報を届けます。

 

※当サイト経由でAFFINGER6を購入すると、限定特典として7点を無料プレゼントします。尚、特典は期間限定なので、予告なく終了する可能性があります。あらかじめご了承ください。

購入者特典

  1. 2021年でも月30万稼ぎ続けるキーワードを10個暴露
  2. 月30万稼ぐサイトのプラグインを公開
  3. レビュー記事の書き方[テンプレート配布]
  4. 比較記事の書き方[テンプレート配布]
  5. ランキング記事の書き方[テンプレート配布]
  6. 質問し放題[無期限]
  7. 限定プラグイン[「SUGOI MOKUJI [LITE]」]

\購入ページはこちら/

7つの限定特典付き

実際に利用している人の評価や特典詳細は、こちらの【特典付きレビュー】AFFINGER6(アフィンガー)の口コミ・評判まとめをどうぞ。

購入手順はこちらの[購入特典あり]AFFINGER6(アフィンガー)の購入&導入手順をどうぞ。

 

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

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

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

吹き出し機能の設定は、上記の3ステップで完了です。

1つずつ解説していきますね。

 

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

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

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

 

無料ならCharat

無料ならCharat

 

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

ただ、注意点が一つありまして、それは利用者が多いという点。アイコンはサイト運営者の顔になるので、ブロガーにとっては大切にしておきたいところ。

 

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

 

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

 

有料ならココナラ

有料ならココナラ

 

有料でアイコンを調達するならココナラがおすすめ。取引がスムーズに行えるだけでなく、絵師さんによっては納得いくまで何度でも書き直してくれる人もいます。

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

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

 

②吹き出しアイコンの設定

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

まずはWordPress管理画面から「AFFINGER6管理」→「会話・ファビコン等」をクリックし、「会話風アイコン」を探してください。(※画像はAFFINGER5ですが、内容は同じです)

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

 

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

 

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

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

 

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

 

こんにちわ!
kazuki

 

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

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

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

 

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

 

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

 

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

吹き出しの色はカスタマイズ画面から変更できます。デフォルトでも使えますが、変更したい人も多いと思うので解説します。

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

ワードプレスの管理画面

 

そこから「オプションカラー」→「会話風吹き出し」の順でクリック。

そこで好きな色に変更できます。

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

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

 

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

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

 

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

 

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

 

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

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

 

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

 

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

 

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

 

以上、吹き出し機能の設定でした。これですぐにでも吹き出し機能を使うことができます。

 

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

 

大丈夫。

次で詳しく解説します!

kazuki

 

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

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

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

使い方は上記の2点だけ。

簡単なのでさくっと解説します。

 

①吹き出しの出力方法

設定した吹き出しアイコンの出力は非常に簡単。記事編集画面で、「タグ」→「会話ふきだし」の順でクリック。

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

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

 

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

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

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

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

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

 

kazuki
ヤッホー!

 

非常に簡単ですね。

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

 

吹き出しの出力

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

 

②吹き出しの反転方法

これができれば吹き出しで会話しているように使えます。

 

kazuki
やっほー!

 

喋りかけんなーーー!!

 

こんな感じにね。

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

会話吹き出しの反転

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

 

反転したったわー
kazuki

 

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

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

 

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

 

AFFINGER6(アフィンガー)吹き出し機能の注意点

AFFINGER6(アフィンガー)吹き出し機能の注意点

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

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

 

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

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

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

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

 

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

 

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

 

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

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

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

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

 

例えば次の通り。

 

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

 

なんで?

 

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

 

そうなの?

 

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

 

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

 

このように、テンポが悪くなるんですよね。

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

 

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

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

 

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

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

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

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

 

また、当サイトでは本記事のようにアフィンガー6に関する記事をまとめております

気になるものがあれば読んでみてください。

 

【アフィンガー6 JET】評価、導入・カスタマイズ方法【すべて語る】

続きを見る

AFFINGER6(アフィンガー)がSEOに強いと言われる5つの理由
AFFINGER6(アフィンガー)がSEOに強いと言われる5つの理由

続きを見る

【初心者向け】AFFINGER6の使い方【絶対に使う機能6選】
【初心者向け】AFFINGER6の使い方【絶対に使う機能6選】

続きを見る

[コピーOK]AFFINGER6でトップページをカスタマイズする手順
[コピーOK]AFFINGER6でトップページをカスタマイズする手順

続きを見る

【最短5分】AFFINGER6(アフィンガー)の初期設定を徹底解説
【最短5分】AFFINGER6(アフィンガー)の初期設定を徹底解説

続きを見る

AFFINGER6(アフィンガー)のブログカードの作り方。2秒で作れます。
AFFINGER6(アフィンガー)のブログカードの作り方。2秒で作れます。

続きを見る

AFFINGER6のランキング作成手順を徹底解説
AFFINGER6のランキング作成手順を徹底解説

続きを見る

【超おしゃれ】アフィンガー6のスライドショーの設定方法と使い方
【超おしゃれ】AFFINGER6のスライドショーの設定方法と使い方

続きを見る

【徹底解説】AFFINGER6で目次を作る方法3選
【徹底解説】AFFINGER6で目次を作る方法3選

続きを見る

 

気になるものがあれば読んでみてください。

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

 

※当サイト経由でAFFINGER6を購入すると、限定特典として7点を無料プレゼントします。尚、特典は期間限定なので、予告なく終了する可能性があります。あらかじめご了承ください。

購入者特典

  1. 2021年でも月30万稼ぎ続けるキーワードを10個暴露
  2. 月30万稼ぐサイトのプラグインを公開
  3. レビュー記事の書き方[テンプレート配布]
  4. 比較記事の書き方[テンプレート配布]
  5. ランキング記事の書き方[テンプレート配布]
  6. 質問し放題[無期限]
  7. 限定プラグイン[「SUGOI MOKUJI [LITE]」]

\購入ページはこちら/

7つの限定特典付き

実際に利用している人の評価や特典詳細は、こちらの【特典付きレビュー】AFFINGER6(アフィンガー)の口コミ・評判まとめをどうぞ。

購入手順はこちらの[購入特典あり]AFFINGER6(アフィンガー)の購入&導入手順をどうぞ。

 

-affinger