ブログ運営

【アフィンガー5】会話ふきだしの設定方法と使い方を解説【超簡単】

会話ふきだしを使う

悩んでる人
会話風のふきだしをよく見かけるけどどうやってやるんだろう

ブログで会話風するやり方がしりたい


こんなお悩みを解決します。

 

kawateru
こんにちは、かわてるです!(@kaz_lion)

いろんな人のブログを見ていると、

記事の一部がLINEみたいな会話形式で書かれていることってありますよね。

rui
こんなやつだね!
そうそう!アフィンガー5ならめっちゃ簡単に設定できちゃうよ!
kawateru

 

この機能はアフィンガー5の公式サイトでも説明されていますが、

始めて使うときに少し戸惑ってしまったので、

画像多めでアフィンガー5導入直後の初心者向け記事となっています!

 

本記事の内容

  • 会話ふきだしの設定方法
  • 会話ふきだし用アイコンの作り方
  • 会話ふきだしの使い方

 

本記事のテーマ

【アフィンガー5】会話ふきだしの設定方法と使い方を解説【超簡単】

本記事の信頼性
kawateru_profile

会話ふきだしのAFFINGER5(アフィンガ―5)設定方法

アフィンガ―5の会話ふきだし設定方法

 

アフィンガー5で会話ふきだしを使う前に、

初めに行っておく設定があるので順に解説していきます。

 

アフィンガー5ではショートコードで簡単に使える

アフィンガー5ではショートコードと呼ばれる専用のコードがあるので、

執筆画面から項目を選択するだけで一瞬で会話ふきだしを使うことができます。

細かい使い方はのちほど説明します。

 

会話ふきだしの設定方法

アフィンガー5で会話ふきだしを設定する手順は以下の3つだけ

  1. 会話・ファビコン設定画面を開く
  2. アイコンの名前を付ける
  3. アイコンの画像を設定する

会話ふきだしの設定画面

まずはWordPressの管理画面左側から「AFFINGER5管理」を選択

設定画面の項目から「会話・ファビコン等」を選択

 

設定画面をひらけたらアイコンごとに設定していきましょう。

アフィンガー5では通常8個の会話ふきだしを登録することができます。

【アイコン画像1】と書かれてある下のボックスにアイコンの名前を付けてあげましょう。

 

会話アイコンの名前を設定出来たら、

次はアイコンの画像を設定していきます。

 

「アップロード」をクリックすると画像を選択できるので、

会話アイコンにしたい画像を選んでください。

 

アイコンにする画像が選べたら、

最後に一番下の保存を押せば、

アフィンガー5で会話ふきだしを使う準備・設定は完了です。

 

会話ふきだし用の画像やアイコンを持っていないという方もいると思うので、

簡単にアイコン画像を作ることができるサービスも紹介していきます。

 

会話ふきだし用AFFINGER5(アフィンガー5)アイコンの作り方

会話ふきだしアイコンの作り方

会話ふきだし用のアイコンは色々ありますが、

ここでは2つご紹介したいと思います。

  • キャラット(自分でアイコンを作りたい人)
  • いらすとや(作るのが面倒な人)

順番に解説していきます。

キャラット(自分でアイコンを作りたい人)

charat

>>キャラット

 

キャラットは数あるパーツを組み合わせることで、

誰でも簡単にアイコンやアバターを作ることができるサービスです。

 

作りたいアイコンの雰囲気に合わせて色々なアバターメーカーが用意されているので、

男性キャラや、猫ちゃんアイコンなども作れちゃいます。

rui
僕もキャラットで作ったよ!

 

いらすとや(作るのが面倒な人)

いらすとやのホームページ

 

アイコンを自分で作るのは面倒という人におすすめしたいのが「いらすとや」というフリー素材サイトです。

優しいタッチの人物イラストが多いので会話アイコンにももってこいのフリー素材です。

悩んでる人
当サイトでもこんな感じで使用しています

 

会話ふきだしのAFFINGER5(アフィンガ―5)使い方

会話ふきだしの使い方

アフィンガー5で実際に会話ふきだしを記事に入れる方法はとても簡単です。

順番に解説していきます。

 

まずはいつもの記事を書く画面を開いてください。

執筆画面が表示されたら上の方にあるツールバーから下記のように選択しましょう。

会話ふきだしの設定

「タグ」➜「会話ふきだし」➜「会話1」

※会話1の部分は初めに設定したアイコン画像1~8の数字と同じです。

会話3を選ぶとアイコン画像3に設定した会話ふきだしのショートコードが挿入されます。

アフィンガー5ふきだしのショートコード

会話1を選択すると上記の画像の上の段のショートコードが表示されると思います。

][←この間に文章を打ち込みます。

kawateru
プレビューするとこんな感じになります

 

たったこれだけでプレビューすれば会話ふきだしになっていますよ!

 

会話ふきだしを反対向きにする方法

右側に会話ふきだしを挿入したいときは上記画像の下の段のような形で「 r」と入力します。

(スペース+小文字半角のr)

先ほど会話1を選択するときに( r]で反対向きって書かれていたのはコレのことです。

 

初心者からすると意味わかりませんよね笑

後はこれを繰り返して会話風にすることもできますし、

ポイントで入れてあげると記事がグッと読みやすくなりますよ。

 

まとめ「会話ふきだしの設定方法と使い方」

会話ふきだしの設定方法と使い方

会話ふきだしをうまく使うことで、

記事が読みやすくなるので読者の離脱率を下げることもできるのでぜひ使ってみて下さい。

 

このサイトでは初心者に寄り添った記事を今後もアップしていきます!

質問等がございましたらお気軽にTwitterからDMください!

質問をもとに実際に記事にさせていただいたこともありますよ♪(@kaz_lion)

【関連記事】【初心者ブロガー必見】ブログで稼ぎたいなら登録すべきアフィリエイトASP5社!

おすすめASP

  • この記事を書いた人
  • 最新記事

kawateru

【ブログ運営】×【Twitter運用】×【エンジニア】 3月からWordPressに移行しました。 4年間ブラック飲食→MGになるも28歳で退職→未経験から開発エンジニアに転職→最短でフリーランス目指す‼ ●大阪出身 ●28歳 ●1児のパパ

-ブログ運営
-,

Copyright© Kawateru blog , 2020 All Rights Reserved Powered by AFFINGER5.