【図解入り】Word Balloonの使い方を徹底解説!ワードプレス吹き出しおすすめプラグイン

当ページのリンクには広告が含まれています。

ワードプレス吹き出しプラグイン「Word Balloon」の使い方

ここ最近では記事に吹き出しを使っているサイトを多く見かけます。

吹き出しを記事に入れることで、楽しく飽きずに読み進めさせれたり、硬いイメージを和らげてくれる、ストーリー性を演出できるなど多くのメリットがありますね。

吹き出し機能を装備したいろんなWordPressテンプレートがありますが、サイトで使う吹き出しデザインは1種類しか選べません。

今回ご紹介するワードプレス吹き出しプラグイン「Word Balloon」は投稿画面で吹き出しのプレビューを見ながら、記事内で複数のデザインを使うことができます。

吹き出しデザインな、な、んと23種類!
さらにビジュアルエディタ、テキストエディタだけでなく、WordPress 5.0 の最新エディター「Gutenberg」にも対応している超優れもののプラグインです。

それでは「Word Balloon」のインストール方法、アイコン設定方法から使い方、23種類の吹き出しデザインまで解説していきましょう。

この記事の目次

【動画解説】Word Balloonの使い方

Word Balloonのアバター設定方法と使い方、詳細モードの設定方法を動画で解説しています。Word Balloonでどんなことができるのか理解していただけると思います。

まずは約13分のこちらの動画をご覧ください。

Word Balloonインストール方法

  1. Word Balloonのインストール
    ダッシュボード>「プラグイン」>「新規追加」をクリックします。
  2. Word Balloonインストール
    キーワードで「Word Balloon」を検索します。いちばん最初に「Word Balloon」が表示されるはずです。「今すぐインストール」をクリック>「有効化」をクリックでインストールは完了です。
プラグインの「有効化」を忘れないようにしましょう!

Word Balloonアイコン設定方法

  1. Word Balloonインストール「Word Balloon」が有効化されると「設定」に「Word Balloon」が追加されます。クリックしましょう。
  2. Word Balloonイラスト設定アバターの新規登録画面が開きます。アバターの画像(150×150px程度:正方形)、名前(アバターの名前)、メモ(アバターに関するわかりやすいメモ)を記入します。
  3. 名前は吹き出し設置の際、アバターの下に表示されます。(※名前は未記入でもOK)メモは投稿画面でアバター選択のときに選ぶ名称になるので、必ず記入するようにしましょう。
  4. 登録したアバターは「アバターのリスト」に表示されます。登録後、各右上の▼クリックで再編集することができます。
  5. Word Balloonアニメーション設定
    「設定」では「吹き出しが画面に表示される際にアニメーションさせる」のON/OFFを選択できます。デフォルトでは「ON」になっていますので、アニメーションをさせたくない方は「OFF」を選択しましょう。
アバター登録は3個までです
「Word Balloon」(無料版)のアバター登録は3個までです。

Word Balloon吹き出し挿入方法

  1. Word Balloonアイコン記事編集画面に「Word Balloon(ふきだし)」のアイコンが追加されています。クリックしましょう。
  2. 吹き出し挿入画面が開きます。「セリフを記入」に吹き出しのセリフを書き込みましょう。
  3. 左下で登録したアイコンを選択できます。(※ここにメモが表示されるので、必ずメモはわかりやすい名称で登録しておきましょう。)
  4. Word Balloon詳細モード右上に「かんたんモード」の選択ボタンがあります。外すと「詳細モード?」の設定画面が開きます。ここで吹き出しの文字色、サイズ等細かい設定が可能ですが、かんたんモードでも十分使えると思います。
  5. Word Balloonイラスト設置赤枠のアイコン選択で、「左吹き出し」右吹き出し」」+真ん中のアイコン選択で「中央寄せ」を指定できます。設定が終了したら右下の「挿入」をクリックします。

左イラスト吹き出しの例

このプラグイン使えるぜ!

右イラスト吹き出しの例

このプラグイン使えるぜ!

左イラスト吹き出しセンター寄せの例

このプラグイン使えるぜ!
かんたんモードでも十分に使えます!

Word Balloon吹き出しデザインはなんと23種類

「Word Balloon」の最大の売りはなんといっても豊富な吹き出しデザイン。「セリフ」エリアクリックで一覧が表示されます。

では「Word Balloon」の吹き出しデザインを紹介しましょう。

吹き出しデザイン「考え事」

Word Balloon吹き出しスタイル

吹き出しデザイン「カラー」

Word Balloon吹き出しスタイル

吹き出しデザイン「丸い」(左吹き出し)

Word Balloon吹き出しスタイル

吹き出しデザイン「丸い」(右吹き出し)

Word Balloon吹き出しスタイル

吹き出しデザイン「しっぽ」(左吹き出し)

Word Balloon吹き出しスタイル

吹き出しデザイン「しっぽ」(右吹き出し)

Word Balloon吹き出しスタイル

吹き出しデザイン「ぽっち」(左吹き出し)

Word Balloon吹き出しスタイル

吹き出しデザイン「ぽっち」(右吹き出し)

Word Balloon吹き出しスタイル

吹き出しに色が付いているデザインでは、左吹き出しと右吹き出しで自動的に色が変わります。

吹き出しデザイン(上側)

Word Balloon吹き出しスタイル

吹き出しデザイン「下側」

Word Balloon吹き出しスタイル

吹き出しデザイン「SOi」

Word Balloon吹き出しスタイル

吹き出しデザイン「RPG I」

Word Balloon吹き出しスタイル

吹き出しデザイン「RPG Ⅱ」

Word Balloon吹き出しスタイル

吹き出しデザイン「RPG Ⅲ」

Word Balloon吹き出しスタイル

吹き出しデザイン「セリフ太枠」

Word Balloon吹き出しスタイル

吹き出しデザイン「ぼっちグラデーション」

Word Balloon吹き出しスタイル

吹き出しデザイン「丸いグラデーション」

Word Balloon吹き出しスタイル

吹き出しデザイン「ハート」

Word Balloon吹き出しスタイル

吹き出しデザイン「にょろにょろ」

Word Balloon吹き出しスタイル

吹き出しデザイン「手書き風」

Word Balloon吹き出しスタイル

吹き出しデザイン「とんがり」

Word Balloon吹き出しスタイル

吹き出しデザイン「8ビット」

Word Balloon吹き出しスタイル

吹き出しデザイン「8ビット Ⅱ」

Word Balloon吹き出しスタイル

吹き出しデザイン「しっぽの考え事」

Word Balloon吹き出しスタイル

未来派的にはシンプルな「ぽっち」「セリフ太枠」「手書き風」が気に入ってます。

Word Balloon提供者のご紹介

「Word Balloon」インストールのときに作成者:YAHMANと表示されます。

YAHMANさんはハンドルネーム「やーまん」で「Back 2 Nature」というすばらしいサイトを運営されています。

やーまんさん

なんとやーまんさんは、Google Mapに道が掲載されて無い山奥へ移住されているんですよね。そんな環境で、プラグイン「Word Balloon」を製作されたというのには驚きしかありません。

ネット回線はどうしているんだろう・・・

Word Balloonには上位版があります

Word Balloonには上位版があります。

Word Balloon PROでは下記の機能が使えるようになります。

  • アバター登録無制限(データーベース上限まで)
  • 吹き出し、アイコンの色を自由にカスタマイズ
  • 定型文の設定が可能
  • カスタマイズした設定を簡単に呼び出し
  • AMPページに対応
  • モバイル端末からのアクセスで吹き出しの種類などを変更
  • 吹き出し、アバター、アイコン毎にインビュー(アニメーション)機能の設定が可能
  • 吹き出し毎にアイコンのカラーカスタマイズが可能
  • 各種設定の変更

プラグインWord Balloon通常版でも十分に使えますが、アバターは3個までしか登録することができません。

口コミなどで3個以上ののアバターを使う方には、プラグインWord Balloon PROはかなり重宝すると思います。

まとめ

Word Balloonの使い方

吹き出しのプラグインといえば、「Speech Bubble」と「LIQUID SPEECH BALLOON」のふたつが有名です。

「Speech Bubble」は多くの方が利用していましたが、2018年12月をもって配信が終了しています。またFTPソフトを使っていちいちアバター画像をアップロードしなければならないというデメリットがありました。

「LIQUID SPEECH BALLOON」も最新エディター「Gutenberg」に対応していて機能も充実していますが、アバター登録の手軽さ、吹き出しデザインの豊富さなどで比較すると「Word Balloon」が一枚上かなと思います。

いろいろなWordPressテンプレートを使っていると思いますが、吹き出しデザインで差別化する意味でも、「Word Balloon」を是非取り入れてみてください。

最後に、やーまんさん、すばらしいプラグインの提供ありがとうございます。
よく読まれている関連記事

【Better Font Awesome】の使い方
【Better Font Awesome】の使い方を図解解説!Webアイコンをサクッと設置できるWordPressプラグイン
この2つのテキストリンク、どちらが見た目きれいですか? >>どちらがきれいに目ますか? どちらがきれいに見えますか? はい。下のテキストリンク前に矢印のアイコンがあったほう
2019-07-15 20:36
自分を変える習慣力で悪い習慣を断捨離しよう
『自分を変える習慣力』を読むべき理由~潜在意識を見方につけて良い習慣を身につけよう
「本業が忙しくて 記事作成の時間がとれないんです。 どうすればいいですか?」 「モチベーションが落ちて、毎日の作業が続かないんです。」 こんな相談をよく受けますが、決ま
2019-07-30 15:02

この記事が気に入ったら
いいね ! しよう

この記事を書いた人

今月のおすすめ無料コンテンツ

未来派野郎hiro公式blog「MIRAIHACK」へようこそ!

下記ツール・イラスト・プラグイン・ノウハウを無料でプレゼントします。お好きなものをダウンロードしてあなたのビジネスで活用してください。(※すべてもOK!)

3Dカバーソフト

 YouTube Adds mini

即戦力ライティング

14の心理効果

ネット税金対策

LP作成ツール WordPressプラグイン「Mikomi」使用

4 Responses to “【図解入り】Word Balloonの使い方を徹底解説!ワードプレス吹き出しおすすめプラグイン”

  1. はじめまして。
    なかいと申します。初心者ですが、いろいろと参考になりました。他にも勉強させてください。宜しくお願いします。

  2. なかいさん、こんにちは。
    吹き出しはいろんな場面で使えるので
    ぜひ取り入れてみてください。

    • 雨宿リョウさん、こんにちは。
      未来派です。

      吹き出しのデザインを自由に選べるのがうれしいですね。記事がお役に立ててよかったです。今後ともよろしくお願いします。<(_ _)>

コメントを残す

最新の記事