どうも!北大生のはる(@_harukitare)です。
今回はWordPressで吹き出しを超簡単に作る方法を解説します。
吹き出しを使えば難しい内容でもわかりやすく説明でき、記事の離脱率が減ってSEOに強い記事が書けます。活用しない手はないですね。
この記事を読めば初心者でも3分でできるようになりますよ~
WordPressの吹き出しは無料プラグインを使えば一瞬

結論から言うと、WordPressの吹き出しは無料プラグイン『Word Balloon』を使えば一瞬で作ることができます。
プラグインなしでもCSSの知識があれば吹き出しを作れてしまうので、以下のような人におすすめです。
プラグインを入れすぎるとサイトの動作が重くなってしまうので注意しましょう!(個人的には15個くらいに抑えるのが良いと考えています。)
WordPress吹き出しプラグイン『Word Balloon』とは

WordPress吹き出しプラグイン『Word Balloon』は日本人のやーまんさん(@b2n_jp)が開発した無料プラグインです。
以前はSpeech Bubbleという吹き出しプラグインが普及していたようですが、WordPress公式サイトで公開停止となったため、現時点ではWord Balloonが最も使われています。
Word Balloonを使うメリットとしては以下のようなものが挙げられます。
プラグインは一度インストールしても削除できるので、一度お試しとして使ってみましょう。
WordPress吹き出しプラグイン『Word Balloon』の使い方

WordPress吹き出しプラグイン『Word Balloon』の使い方は非常に簡単です。丁寧に解説していきます。
Word Balloonのインストール方法
まずはWordPressにログインして、ダッシュボードの『プラグイン』押しましょう。
するとプラグインブラウザーの画面になるので、右の虫メガネマークを押します。

そして『word balloon』と検索してプラグインを見つけ、インストールしましょう。

インストール後は有効化することを忘れないように注意してください。

Word Balloonの使い方
※今回はビジュアルエディタで解説しますが、他のエディタもほとんど同じように使えるのでご安心ください。
Word Balloonを有効化すると、下の画像のようにボタンができるので押しましょう。

以下のようなものが出てくるので、まずはアバターを設定しましょう。
人のシルエットになっているところをクリックします。

アバターの画像を選択する画面になるので、ファイルをアップロードしてメディアライブラリから選択します。

あとはセリフを入力すれば基本的なところは完了です。

せっかくなので、細かい設定でどんなことができるのかも解説します。
下の画像の赤枠で囲ったところに並んでいるアイコンを左から順に説明していきますね。

アバター設定(人型アイコン)
アバター設定では以下のことが設定できます。
- アバターのサイズ・向き
 - アバターの名前
 - アバターの枠線・影
 
個人的にはアバターに名前を付けると親しみやすくていいと思います。
吹き出し設定(吹き出しアイコン)
吹き出し設定では以下のことが設定できます。
- 文字の色・大きさ
 - 吹き出しの配置・大きさ
 
ここは見た目がうるさくなるので1記事1記事に統一感を持たせた方がいいですね。
アイコン設定(ニコちゃんマーク)
アイコン設定では以下のことが設定できます。
アイコンの種類には次のようなものがあります(少し省略しています)
- 上矢印
 - 下矢印
 - はてな
 - ハート
 - 怒りマーク
 - ビックリマーク
 - 音符
 - 汗
 - がーん
 - 星
 - キラーン
 - どよーん
 - はっ
 
アイコンをたくさん用意しなくても感情が表現できるのはうれしいですね。
効果設定(キラキラマーク)
効果設定では以下のようなことが設定できます。
アニメーションには次のようなものがあります(少し省略しています)
- 上下
 - 振り子
 - 鼓動
 - 振動
 - 左右
 - 回転
 - 点滅
 - ロール
 - ゴム
 
面白いですが使いすぎは禁物ですね。強烈に目を引くことは間違いないので、ここぞというときに使いましょう。
フィルター設定(フィルターマーク)
フィルター設定では以下のようなことが設定できます。
フィルターの種類には次のようなものがあります(少し省略しています)
- ぼかし
 - 明度
 - コントラスト
 - モノクロ
 - 色調回転
 - 階調反転
 - 透過
 - 彩度
 - セピア
 
インパクトを与えるのに有効活用していきましょう。
ステータス設定(吹き出しマーク)
ステータス設定では以下のようなことが設定できます。
- コメント
 - サウンド
 
サウンドは音声ファイルをWordPressに入れることが必要になります。
WordPressの吹き出しを超簡単に作る方法まとめ
今回はWordPressの吹き出しを作る方法について解説してきました。
僕は『Word Balloon』かなり気に入っているので、皆さんもよかったら使ってみてください!


			
			
			
			
			
			
			
			
コメント
コメント一覧 (3件)
[…] >>wordpressの吹き出しを超簡単作る方法 […]
はじめまして!いつも記事拝見させて頂いております。
一つ気になったのですが、吹き出しに入れていたり、ご使用になられているアイコンのキャラクターや画像はどのように作られたんですか??
可愛くて真似したいなーと思い質問させていただきました。
コロナが流行っておりますが体に気をつけてお過ごしください!
べーこんさん!
はじめまして!
参考にしていただきありがとうございます。
女の子のアイコンは以下の記事を読んでみてください~
https://harukitare.com/header-how-to-make/
僕のアイコンはTwitterでミキむらさん(@nkwr913)に依頼しました!
おすすめです~