吹き出しを使って記事にオリジナリティを出すンダ
「WordPressで吹き出しを使いたい」
「吹き出しの設定を変更できるプラグインはないかな」
と、WordPressで吹き出しを使用したいが、どのプラグインを導入すればいいのか悩んでいる方がいるのではないでしょうか。
そこで、今回はWordPressで吹き出しを簡単に作成できる『Word Balloon』というプラグインをご紹介します。
『Word Balloon』はただ吹き出しを作成できるだけではなく、デザインを自由に選択できたり、カラーやアニメーションを吹き出しにつけることも可能です。
そのため、独自性のある記事を作成したいという人や、吹き出しをよく使用して記事を作成する人にとっては、とてもオススメのプラグインです。
『Word Balloon』とは
『Word Balloon』とは、WordPressプラグインの一つです。
YAHMAN(やーまん)さんという日本の素晴らしい方が開発されています。
やーまんさんのwebサイトはこちら
Word Balloonを使用すれば、投稿画面で吹き出しを簡単に作成できます。
デザインが豊富で、アニメーションや音声も付けれることから、一風変わったオリジナルの吹き出しを作成できます。
『Word Balloon』の使用方法
1. まずは『Word Balloon』をインストールしましょう
管理画面の左サイドメニューより『プラグイン』→『新規追加』をクリックします。 プラグインの検索に『Word Balloon』と入力し検索します。

『Word Balloon(吹き出し)』というプラグインが検索結果に表示されるので、『今すぐインストール』ボタンをクリックしましょう。 インストールが完了したら、『有効』ボタンをクリックすればインストールは完了です。
2.吹き出しのアバターを登録しよう
『Word Balloon』は、3種類まで無料で吹き出しのアバターを登録できます。ただし、4種類以上アバターを登録したい場合は、有料版を購入する必要があるのでご注意ください。(有料版については後に解説いたします。)
アバターの登録は、管理画面の左サイドメニューより『設定』→『Word Balloon』をクリックします。

上記の画面にて、アバターの登録をおこなえます。
アバターの名前・アバターのメモを任意で入力します。
『写真の選択』ボタンをクリックして、アバターに登録したい画像をWordPressにアップロードされた画像より選択します。
最後に、『アバターの登録』ボタンをクリックすれば、アバターの登録が完了します。
このアバターの登録は、3回まで無料でおこなえます。
アバターの登録が完了すると、『アバターリスト』に以下のように表示されます。
アバターリストからID・名前・メモ・優先度を自由に変更できます。

3.吹き出しを投稿画面で使用してみよう
吹き出しのアバターの登録が完了したので、実際に投稿画面で吹き出しを使用してみましょう。
管理画面の左サイドメニューより『投稿』→『新規追加』をクリックします。

投稿画面が表示されるので、『ブロックを追加』ボタンをクリックします。
『一般ブロックリスト』の中から、『Word Balloon』を選択してください。

上記のように、作成したアバターの吹き出しが表示されます。
吹き出しのアバターを変更したい場合は、右サイドメニューの『基本設定』→『アバター』より登録したアバターを選択できます。
『Word Balloon』の特徴をご紹介
『Word Balloon』の魅力的な以下の4つの特徴をご紹介していきます。
特徴1:吹き出しのデザインは28種類
特徴2:20種類のアニメーションの機能
特徴3:吹き出しに音を付けれる
特徴4:その他多彩な機能
特徴1:吹き出しのデザインは28種類
吹き出しのデザインは28種類もあり、記事の内容にあったオリジナルの吹き出しを作成できます。
吹き出しのデザインは、投稿画面より『Word Balloon』を選択して、右サイドメニューに表示される『基本設定』の『吹き出し』で好きに変更できます。
1.セリフ

デフォルトで設定されます。
2.考え事

考え事をしているような吹き出しです。
3.カラー

吹き出しのカラーを変更できます。
4.丸い

吹き出しの三角部分がなく、デザインが丸くなっています。
5.しっぽ

吹き出しの三角部分がしっぽのようなデザインになっています。
6.ぽっち

吹き出しの三角部分が小さいです。
7.上側

吹き出しが上側に配置されます。
8.下側

吹き出しが下側に配置されます。
9.SOi

SOiで使用されている吹き出しです。
10.RPG Ⅰ

RPGで使用されているような吹き出し1つ目です。
11.RPG Ⅱ

RPGで使用されているような吹き出し2つ目です。
12.RPG Ⅲ

RPGで使用されているような吹き出し3つ目です。
13.セリフ 太枠

吹き出しの枠が太くなっています。
14.ぽっち グラデーション

吹き出しの三角部分が小さく、背景色がグラデーションになっています。
15.丸い グラデーション

吹き出しの三角部分がなく、背景色がグラデーションになっています。
16.ハート

ハートのデザインをした吹き出しです。
17.にょろにょろ

吹き出しの三角部分がにょろにょろしたデザインになっています。
18.手書き風

手書き風の吹き出しです。
19.とんがり

吹き出しの三角部分がとんがったデザインになっています。
20.8ビット

8ビットで作られた吹き出し1つ目です。
21.8ビット Ⅱ

8ビットで作られた吹き出し2つ目です。
22.しっぽの考え事

吹き出しの三角部分がしっぽのようになっており、考え事をしている吹き出しです。
23.叫び

叫んでいる吹き出しです。
24.セリフ 上側

セリフが上側に配置されている吹き出しです。
25.セリフ 下側

セリフが下側に配置されている吹き出しです。
26.考え事2

雲のようなデザインで、考え事をしている吹き出しです。
27.セリフ 上側中央

セリフが上側中央に配置されている吹き出しです。
28.セリフ 下側中央

セリフが下側中央に配置されている吹き出しです。
特徴2:20種類のアニメーションの機能
『Word Balloon』は、吹き出しのデザインが豊富なだけではなく、吹き出し・アイコン・アバターの3つに18種類からアニメーションを設定できます。
アニメーションをうまく使用すれば、記事を読んでいるユーザーに目で見て楽しんでもらえます。
ただし、アニメーションを使用しすぎてしまうと、ユーザーに読みにくいという印象を与えてしまう恐れがあるため、使用しすぎはNGです。
アニメーションは、投稿画面より『Word Balloon』を選択して、右サイドメニューに表示される『効果』で好きなように変更できます。
アニメーションは以下の20種類より選択できます。
1.上下 | 2.振り子 | 3.揺れる | 4.鼓動 |
5.振動 | 6.左右 | 7.右回転 | 8.左回転 |
9.点滅 | 10.ロール右 | 11.ロール左 | 12.ロール上 |
13.ロール下 | 14.上がって消える | 15.下がって消える | 16.ゴム |
17.ぶるぶる | 18.振り振り | 19.右回り | 20.左回り |
特徴3:吹き出しに音を付けれる
投稿画面より『Word Balloon』を選択して、右サイドメニューに表示される『ステータス』の『サウンド』より好きに変更できます。
『サウンド』ボタンをクリックし、WordPressにアップロードされたサウンドファイルを選択すると設定できます。
吹き出しのセリフを自分で読んで録音して、サウンドに登録しても面白いですね。
うまく吹き出しに音をつけて、楽しい吹き出しを作ってください。
特徴4:その他多彩な機能
『Word Balloon』は吹き出しのデザインを変更したり、アニメーション・サウンドを付けれる以外にも様々な機能があります。
・吹き出しの位置変更
吹き出しとアバターの位置を、左か右に選択できます。

上記の画像のように、吹き出しの位置を左と右でうまく使い分ければ、会話をしているように表現できます。
画像の位置設定は、投稿画面より『Word Balloon』を選択して、右サイドメニューに表示される『基本設定』の『位置』より好きに変更できます。
・アバターの表示設定
投稿画面より『Word Balloon』を選択して、右サイドメニューに表示される『アバター』より以下の設定をおこなえます。
アバターのサイズ(小・中・大) | 角丸 |
周辺に枠線を入れる | 影を入れる |
アバターを非表示 | 反転 |
水平 | 垂直 |
枠線(色・枠線の種類・枠線の太さ) | 名前(位置・名前の変更) |
・アイコン
以下の画像のように、アバターの上にアイコンを表示させることができます。

アイコンは以下の18種類です。
上矢印 | 下矢印 | はてな |
ハート | ハート(複数) | ハート(横並び) |
怒り | 感嘆符 | 感嘆符(複数) |
8分音符 | 汗 | 汗汗 |
がーん | 星 | 星(横並び) |
キラーん | どよーん | はっ |
アイコンは、位置・サイズ・反転・水平・垂直の設置もおこなえます。
アイコンを使用することによって、吹き出しの会話の感情を記事を読んでくれているユーザーに伝えやすくなります。
・フィルター
アバター・吹き出し・アイコンの3つにフィルターを設定できます。
フィルターの設定は以下の11種類です。
ぼかし | 明度 | コントラスト |
モノクロ | 色調回転(90/180/270) | 階調反転 |
透過 | 彩度 | セピア |
有料版『Word Balloon PRO』について
有料版『Word Balloon PRO』では、無料版とは異なり以下の機能を使用できるようになります。
- アバターがデータベースの上限まで無制限で登録できるようになる
- AMPページにも対応する
- お気に入り登録ができるようになり、使用したい吹き出しを簡単に呼び出せるようになる
- モバイル表示専用に吹き出し設定をおこなえるようになる
- 吹き出し、カラーなどの初期設定を登録できるようになる
『Word Balloon PRO』はライセンスの有効期限が1年間のサブスクリプション方式です。
3種類のライセンスがあり、個人サイト向け・複数サイト向け(2サイト)・複数サイト向け(3サイト)があります。
メニュー | 料金 | 有効期限 |
個人サイト向け | 1,280円 | 1年 |
複数サイト向け(2サイト) | 2,160円 | 1年 |
複数サイト向け(3サイト) | 2,940円 | 1年 |
複数のサイトで『Word Balloon PRO』を使用したいと考えている場合は、複数サイト向けのライセンスを取得した方がお得な料金設定になっています。
また、ライセンスの有効期限内で、機能を無制限に使用できます。
『Word Balloon PRO』は以下のURLより購入できます。
https://back2nature.jp/edd/word-balloon-pro
自分の目的にあったライセンスを取得してください。
『Word Balloon』を使用してオリジナルの吹き出しを作成しよう
『Word Balloon』のインストール方法や、機能の特徴をご紹介しました。
吹き出しのデザインは28種類から選択でき、アニメーションは20種類から選択できます。また、吹き出しにサウンドをつけれたりとそのほかにも様々な機能が搭載しています。無料版では、3種類までアバターを自由に登録でき、無制限でアバターを登録したい場合には有料版『Word Balloon PRO』も用意されています。
『Word Balloon』をうまく活用して、オリジナルの吹き出しを作成し、記事を華やかにしましょう。