Speech bubbleをインストールしてみた
Speech bubbleは、ショートコードを利用して記事に下記のような吹き出しを表示できるプラグインです
このプラグインを使うと、ここで紹介しているように対話しているような【吹き出し】が出来上がります
※画像も変更できますが、動作確認がメインですのでここでは画像変更方法は省きました
このプラグインを使うと、ここで紹介しているように対話しているような【吹き出し】が出来上がります
※画像も変更できますが、動作確認がメインですのでここでは画像変更方法は省きました
対談を表現したり、Q&Aに使ったり、様々な用途に利用できるのではないでしょうか
Speech bubbleを利用してワードプレスを楽しんでください
type=dropの見本
Aさん
type=”drop” subtype=”R1″です
no name
type=”drop” subtype=”R1″です
1 2 |
[speech_bubble type="drop" subtype="L1" icon="1.jpg" name="Aさん"]type="drop" subtype="R1"です[/speech_bubble] [speech_bubble type="drop" subtype="R1" icon="2.jpg" name="Bさん"]type="drop" subtype="R1"です[/speech_bubble] |
type=stdの見本
Aさん
type=”std” subtype=”L1″です
Bさん
type=”std” subtype=”R1″です
1 2 |
[speech_bubble type="std" subtype="L1" icon="1.jpg" name="Aさん"]type="std" subtype="L1"です[/speech_bubble] [speech_bubble type="std" subtype="R1" icon="2.jpg" name="Bさん"]type="std" subtype="R1"です[/speech_bubble] |
type=fbの見本
Aさん
type=”fb” subtype=”L1″です
Bさん
type=”fb” subtype=”R1″です
1 2 |
[speech_bubble type="fb" subtype="L1" icon="1.jpg" name="Aさん"]type="fb" subtype="L1"です[/speech_bubble] [speech_bubble type="fb" subtype="R1" icon="2.jpg" name="Bさん"]type="fb" subtype="R1"です[/speech_bubble] |
type=fb-flatの見本
Aさん
type=”fb-flat” subtype=”L1″です
Bさん
type=”fb-flat” subtype=”R1″です
1 2 |
[speech_bubble type="fb-flat" subtype="L1" icon="1.jpg" name="Aさん"]type="fb-flat" subtype="L1"です[/speech_bubble] [speech_bubble type="fb-flat" subtype="R1" icon="2.jpg" name="Bさん"]type="fb-flat" subtype="R1"です[/speech_bubble] |
type=lnの見本
Aさん
type=”ln” subtype=”L1″です
Bさん
type=”ln” subtype=”R1″です
1 2 |
[speech_bubble type="ln" subtype="L1" icon="1.jpg" name="Aさん"]type="ln" subtype="L1"です[/speech_bubble] [speech_bubble type="ln" subtype="R1" icon="2.jpg" name="Bさん"]type="ln" subtype="R1"です[/speech_bubble] |
type=ln subtype=cの見本
subtype=”L1″とsubtype=”R1″をsubtype=”c” subtype=”d”と変えると下記のようになります
Aさん
type=”ln” subtype=”c”です
Bさん
type=”ln” subtype=”d”です
1 2 |
[speech_bubble type="ln" subtype="c" icon="1.jpg" name="Aさん"]type="ln" subtype="c"です[/speech_bubble] [speech_bubble type="ln" subtype="d" icon="2.jpg" name="Bさん"]type="ln" subtype="d"です[/speech_bubble] |
type=ln-flatの見本
Aさん
type=”ln-flat” subtype=”L1″です
Bさん
type=”ln-flat” subtype=”R1″です
1 2 |
[speech_bubble type="ln-flat" subtype="L1" icon="1.jpg" name="Aさん"]type="ln-flat" subtype="L1"です[/speech_bubble] [speech_bubble type="ln-flat" subtype="R1" icon="2.jpg" name="Bさん"]type="ln-flat" subtype="R1"です[/speech_bubble] |
type=pinkの見本
Aさん
type=”pink” subtype=”L1″です
Bさん
type=”pink” subtype=”R1″です
1 2 |
[speech_bubble type="pink" subtype="L1" icon="1.jpg" name="Aさん"]type="pink" subtype="L1"です[/speech_bubble] [speech_bubble type="pink" subtype="R1" icon="2.jpg" name="Bさん"]type="pink" subtype="R1"です[/speech_bubble] |
type=rtailの見本
Aさん
type=”rtail” subtype=”L1″です
Bさん
type=”rtail” subtype=”R1″です
1 2 |
[speech_bubble type="rtail" subtype="L1" icon="1.jpg" name="Aさん"]type="rtail" subtype="L1"です[/speech_bubble] [speech_bubble type="rtail" subtype="R1" icon="2.jpg" name="Bさん"]type="rtail" subtype="R1"です[/speech_bubble] |
type=thinkの見本
Aさん
type=”think” subtype=”L1″です
Bさん
type=”think” subtype=”R1″です
1 2 |
[speech_bubble type="think" subtype="L1" icon="1.jpg" name="Aさん"]type="think" subtype="L1"です[/speech_bubble] [speech_bubble type="think" subtype="R1" icon="2.jpg" name="Bさん"]type="think" subtype="R1"です[/speech_bubble] |
インストールと設定
【インストール方法】
WordPress管理画面 > プラグイン > 新規追加 >「Speech Bubble」で検索
【設定画面】
プラグインの管理画面はありません。吹き出しの表示内容は上記のようなショートコードを記事内に利用して指定します。実際の動作はこちらのページにあります
まとめ
使ってみた感想
・ワンポイントとして記事の見栄えが良くなる
・ショートコードを挿入するだけで良い
※コード挿入ボタンは無いので、このページのコードをコピペして表示してみてください
エディタにコードボタンが追加されてもっと簡単な吹き出しプラグインPz-Talkもあります

Pz-Talkは、顔アイコンと吹き出しを表示して会話を表現する日本人が公開しているプラグインです。「吹き出し会話風」と「メッセンジャー(LINE)風」の二通りを表示できます。
このページのツイートフォローよろしく

WordPressプラグイン動作確認 Speech bubbleは、記事に簡単に吹き出しを追加できるプラグイン https://t.co/MPieYrfld9 #ワードプレス #プラグイン pic.twitter.com/CmpUQTs4zN
— WordPressを楽しむ (@wp_info201601) January 4, 2016
▼関連記事

インストールしたプラグインをローカルでテストしながら紹介しています 。WordPressに必須プラグインやお薦めプラグインも紹介しています
Twitter
欲しかったプラグインですが、他のページの紹介を見てもコードが今一解からずどうしようか悩んでました。ここを見てソースも解かりやすかったので使うことにしました。ちなみにリクエスト受け付けてないのですか?
ご訪問ありがとうございます
(type=”think” subtype=”L1″)の部分を変えれば表示がかわりますのでページ作り頑張ってください
基本はリクエストは受けておりませんが、どうしても動作がみたいプラグインがありましたらリクエストしてみて下さい
お約束はできかねますが、気になるプラグインなら考えます(*^^)v