ブログ記事に吹き出しを挿入する方法（WordPress）

LIM

こんにちわ！LIMです！

今日も「なんか役に立つブログ」書いていきます！

クラシックエディタで記事に吹き出しを入れるのってどうやるんだろう？

今日はそんな疑問にお答えします。

ブログ記事をちょっとリッチにする方法、「吹き出し」についてです。自己紹介や最初の挨拶、読者の疑問の提起などで吹き出しがあると読者にとってもイメージしやすくなります。また、ブログ記事を彩ることで自分のモチベーションアップにも繋がったりもしますよね。記事の印象を変える上でとても簡単で便利な機能ですのでオススメです！

１. 吹き出しを入れる＝プラグインを使う　※注意点あり

基本的に吹き出しはプラグインを使って挿入できます。プラグインはいくつかあって自分に合ったものを選択するのが良いでしょう。以下代表的な吹き出しプラグインです。

• Word Balloon
• LIQUID SPEECH BALLOON (吹き出し)
• Speech Balloon Maker （ふきだしメーカー）
• WP-Speech-Balloon

ただし、注意点として、ブロックエディタでしか機能しないプラグインや、クラシックエディタでも使えるけども一手間かかるものもあります。そのため、クラシックエディタでストレスなく使えるプラグインはいくつか限られていますので、今回はクラシックエディタ利用者でもスムーズに使えるプラグインとその使い方をご紹介します。

２. クラシックエディタでも使える吹き出しプラグイン
「Word Balloon」

クラシックエディタで使える吹き出しプラグインの代表としてWordBalloonをおススメします。今まさに僕が使ってる吹き出しです。こちらはクラシックエディタでも難なく使えますのでご安心を！

• プラグイン検索時↓

• 実際の利用時↓

LIM

こんな感じでアニメーション入ってます！

アニメーションも入っいておしゃれです。使い方も簡単なので、是非使ってみてください。それでは、使い方を説明していきます。

３. Word Balloonのプラグインインストール

ここから具体的なWordBalloonの利用方法です。まずは下記手順でプラグインを入れましょう。

※プラグインの入れ方がわかる方は読み飛ばして下さい。

①プラグイン→新規追加の順にクリックします。

②下記のように検索窓で「Word Balloon」で検索すると、Word Balloonが表示されるので「今すぐインストール」を押します。

インストールが完了したら、ボタンを押して有効化するのをお忘れなく！

４. Word Balloonの設定

続いてインストールが完了したら、早速アバターを設定して使ってみましょう！

①まずは画像の設定からです。下記のように「設定」→「Word Balloon」を選択して下さい。

②続いて、「画像を選択」をクリックします。

③画像選択画面が出るので、アバターに使う画像を選択して、「選択」をクリックします。

④次に、「名前」にアバターに表示する名前を入れて「アバターの登録」ボタンをクリックします。

下記のように、登録したアバターが出てきたら完了です！

アバター設定が完了したら、早速使ってみましょう！

５. 記事にWord Balloonを挿入

上で設定が完了したら、いよいよ記事に挿入する方法です。WordBalloonをインストールすると下記のようにクラシックエディタ画面のツールバーに２つの吹き出しマークが出てきます。使い方はあまり変わらないですが、それぞれ説明します。（結果は同じです。）

それではまず←こちらの吹き出しボタンの使い方からご説明します。

１. 吹き出しボタンの使い方

①記事にセリフの文字を何も打ってない状態でボタンをクリックして下さい。

②次に下記のような画面が出るので、画面に直接セリフを入力してボタンを押しましょう。

③すると、下記のような感じでコードが挿入されますので「プレビュー」をクリックしてうまく表示されたか見てみましょう。

下記のように表示されていれば完了です！

２. 吹き出しボタンの使い方

①まずは下記のように、セリフにしたい文字を記事に入力して下さい。

②次に、下記のように入力した文字をドラッグして、ボタンをクリックして下さい。

③すると、上で打った文字が入っていることを確認して挿入ボタンボタンをクリックします。

④挿入ボタンをクリックすると下記のようにコードが挿入されるので「プレビュー」をクリックして正しく表示されたか確認してみましょう。

下記のように表示されれば完了です！