ブログで「ふきだし」使ってみない?WordPressで簡単にふきだしを実装する方法

徳島で動くグラレコと言えばUSANET!
「グラレコ動画」や「動く手描き絵」を描いている、さのはるかです。
USANET さの はるか
USANET さの はるか

ワードプレスでふきだしを使えるようにカスタマイズする方法をご紹介します。

先日、徳島市の「テレワークセンター徳島」の研修室をお借りして、WordPress(ワードプレスと読みます。ホームページやブログが作れるよ!)の勉強会を行いました。

その時に、似顔絵や顔写真付きの「ふきだし」を参加者の方1人1人の分をご用意し、使っていただいたところ…

「これよく見るー!」
「やりたかったやつ!」

と、みなさん「ふきだし」に元々興味を持っていたようでした✨

ふきだし、私も大好き!こんな風に一言コメントなどで、よく使っています🎵
USANET さの はるか
USANET さの はるか

このふきだし、実はワードプレスならすごく簡単に使えるんです!

今回のブログでは、そんなブログの「ふきだし」についてご紹介します。

ワードプレスなら顔アイコンのふきだしが超簡単に使える!

ワードプレスなら顔アイコンのふきだしが超簡単に使えます!

ワードプレスで顔アイコンのふきだしを使うのが、どのくらいに簡単なのかと言うと

実際に吹き出しの入力画面を動画にしてみたのでご覧ください。

MEMO
プラグイン「Word Balloon」を使用した場合です

入力画面で吹き出しのアイコンをクリックして、文章を入力するだけ!

最後にハイライトしている部分がふきだしのショートコードです。このショートコードを毎回入力しなくても、動画のように操作するだけで、簡単にふきだしを入れることができるんです!

簡単でしょ〜🎵
USANET さの はるか
USANET さの はるか

ワードプレスでふきだしを使う方法

この吹き出しの機能ですが、ワードプレスをインストールすれば初めから使えるのかと言うと、そうではありません。

吹き出しを使う方法は色々とあるのですが、簡単な方法を2つご紹介します。

方法その1:ブログに特化したテーマを使う

ふきだしを使う方法その1は、ブログに特化したテーマを使うことです。

テーマって何?アメブロとワードプレスでは何が違うの?

MEMO
テーマと言うのは、ワードプレスで使えるデザインテンプレートのことです。

ワードプレスには、「テーマ」と呼ばれるたくさんのデザインテンプレートがあります。(無料、有料どちらもありますし、海外製も日本製もあります。)

アメブロやはてなブログでも、同じようにデザインテンプレートが選べると思います。デザインテンプレートを変更すると、ブログの見た目は変わりますよね。

ワードプレスがアメブロやはてなブログと違う点は、テーマを変更すると管理画面やブログの入力画面も変更になるものがあるということです。

ブログに特化したテーマなら最初からふきだしも入っている

ブログに特化したテーマなら、最初からふきだし機能も入っていて、簡単に使えるようになっているものが多いです。

MEMO
ブログに特化したテーマを使えば、最初から吹き出しや注意書きボックス、文字の装飾など、ブログの執筆がはかどる機能が実装されています。例えばこんなボックスですね。

ワードプレスでブログを始める場合に、使うテーマに迷ったら、ブログに特化したテーマを使うことをおすすめします。

ブログに特化したテーマってなに?検索したけど、どれがいいのかよく分からない…と言う方は、お気軽にご相談ください🎵
USANET さの はるか
USANET さの はるか

方法その2:プラグイン「Word Balloon」 を使ってふきだしを実装

ふきだしを使う方法その2は、「プラグイン」を使って実装することです。

ちなみにこのブログでは「Word Balloon」と言うプラグインを使ってふきだしを表示しています。

【WordPress】会話形式の吹き出しプラグイン Word Balloon【公式ページ】

考え事風のふきだしや…
USANET さの はるか
USANET さの はるか
USANET さの はるか
USANET さの はるか
手書き風のふきだし
USANET さの はるか
USANET さの はるか
RPG風など、遊び心のあるふきだしもありますよ!

ブログの内容や雰囲気に合わせて、使うふきだしを変えてもいいですね。

プラグインってなに?

ワードプレスは、「プラグイン」と呼ばれるツールを使って機能を拡張することができます。

プラグインを使えば、プログラミングの知識等がなくても、簡単に便利な機能を追加できます✨

質の良いものから悪いもの、無料から有料まで様々な「プラグイン」が存在します。

プラグインを使う場合の注意点は?

とても便利なプラグインですが、安易になんでも入れると困ったことになる場合もあるので次のことに注意してください。

  • 使用中のWordPressと互換性があるかどうか
  • 最終更新日が古くないか
  • 危険性が指摘されていたり、怪しいプラグインではないか
  • 他のプラグインとの相性が悪いものではないか(プラグインの組み合わせで不具合が出る場合がある)
  • プラグインを入れすぎて重くなっていないか

私なら、この参考画像のようなプラグインは怖いのでインストールを避けます。

使用中のワードプレスとの互換性がない

最終更新が9年前!

使用中のWordPressのバージョンで未検証

ワードプレスをご自身で管理している方は、安易なプラグインの追加にご注意を。不安な方は、新しくプラグインを入れる前に必ずバックアップを取っておきましょう
USANET さの はるか
USANET さの はるか

プラグイン「Word Balloon」の実装方法

プラグイン「Word Balloon 」の実装方法をご紹介します。

まず、ワードプレスの管理画面にログインして、プラグイン→新規追加→検索で「Word Balloon 」と入力しましょう。

プラグインを新規追加→検索

すると、ふきだしアイコンのプラグイン「Word Balloon 」が表示されるので「いますぐインストール」ボタンを押してインストールします。

ふきだしプラグイン。ブロックエディタにも対応。

インストールしたら、設定 > Word Balloon からふきだし用の画像や名前を設定して登録します。

写真や名前を登録する

あとは、動画で紹介した通り、入力画面でふきだしアイコンをクリックしてテキストを入力すれば簡単にふきだしを使えます。

入力画面です

この記事の冒頭でもご紹介した動画です。

画像は複数登録できるので、例えば複数人登録したり、泣き顔や怒った顔なんかを登録してもブログで使えそうですね💡
USANET さの はるか
USANET さの はるか

他にもふきだしを使えるようにするプラグインや方法はありますが、今回はこのブログでも使っている「Word Balloon」をご紹介しました。

さいごに

ワードプレスで顔アイコン付きの「ふきだし」を使う方法についてご紹介しました。

ワードプレスのいいところは、自由度の高さと拡張性です。

どんどん便利な機能やブログが捗る機能を追加して、ブログ執筆を楽に、楽しくしちゃいましょう✨

この記事を書いた人

USANET さの はるか

グラフィックレコーダー、イラストレーター
徳島でフリーランスのテレワーカーしてます。趣味も仕事もボーダーレス。制作することが大好きです!

詳しいプロフィールはこちら

USANETのLINE公式アカウントを友だちに追加