This plugin hasn’t been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues when used with more recent versions of WordPress.

Speech bubble (ふきだしプラグイン)


You can easily add speech bubble ornament in your post, without direct HTML&CSS coding.


  • Ornament your posts with speech bubbles (like Chat,Act,lect.,etc)
  • 9 pattern speech bubbles are available (at version 1.0)
  • Fit narrow frame automatically
  • By short code, use speech bubble.
  • Quickly use them without using direct HTML&CSS code and database
  • In a post, you can use same speach bubble more easily (Preset Type)
  • Not support IE8

Example and How to use Page

Japanse explanation


  • Example, using type="std".
  • Fit narrow frame automatically, use type="std".
  • Short code sample
  • Using type="drop", please try other type!


  1. See WordPress ControlPanel.
  2. Log in.
  3. Click Plugin->Add New.
  4. Search Speech Bubble Plugin
  5. Click Active Plugin button.

You can use Speach bubbles in your post.


How to add new icon

Upload to speach-bubble/img/ folder.

How to use “Quick” type short code

Write the below example to post by “Text mode”.

[speech_bubble type="std" subtype="a" icon="1.jpg" name="A san" ]Ask something. [/speech_bubble]
[speech_bubble type="std" subtype="b" icon="2.jpg" name="B san" ]Answer something.[/speech_bubble]
[speech_bubble type="std" subtype="c" icon="1.jpg" name="A san" ]Think something. [/speech_bubble]
[speech_bubble type="std" subtype="d" icon="2.jpg" name="A san" ]Think something, too.[/speech_bubble]

type: std, fb, fb-flat,ln,ln-flat,pink, rtail,drop, think

subtype: a,b,c,d

icon: Use images in “speach-bubble/img/” folder.

How to use “ID preset” type short code

Write the below example to post by “Text mode”.

{sb_id=11:type=std ,subtype=left1,icon=1.jpg,name=Antonio}
{sb_id=22A:type=st d, subtype=right1,icon=2.jpg,name=Sebastian}
{sb_id=33:type=std ,subtype=left2,icon=1.jpg,name=Antonio}
{sb_id=44:type=st d, subtype=right2,icon=2.jpg,name=Sebastian}
[speech_bubble_id sb_id=11]Ask something. [/speech_bubble_id]
[speech_bubble_id sb_id=22A]Answer something.[/speech_bubble_id]
[speech_bubble_id sb_id=33]Think something. [/speech_bubble_id]
[speech_bubble_id sb_id=44]Think something, too.[/speech_bubble_id]

subtype: a,b,c,d,L1,R1,L2,R2,left1,right1,left2,right2

This {:} section is for preset id. Write this section from [speech_bubble_useid] to {SPEECH_BUBBLE_DELIMITER}.

These short code doesn’t work well. Why?

We think it cause maybe by miss type.

Use Developer tools -> element and Search next message in html (for example in chrome)


These code will help you.

These short code doesn’t work well. Why? (in ID preset type)

We think it maybe cause by miss type, too. But ID preset type is more complicated.

And, then we prepare the analysing flag for preset type. Input like,

[speech_bubble_preset id_analysis="ON"]
{sb_id=11:type=ste ,subtype=left1,icon=1.jpg,name=Antonio}
[speech_bubble_id sb_id=11]Ask something. [/speech_bubble_id]

Show the analysed result like below in your post.


>type=”std” subtype=”a” icon=”1.jpg” name=”A san”


>type=”std” subtype=”b” icon=”2.jpg” name=”B san”


>type=”SB_ALERT_TYPE_MISSING” subtype=”a” icon=”1.jpg” name=”Antonio”


In this example, I do miss type type=“ste”(std:correct), and show type=”SB_ALERT_TYPE_MISSING”.

sb_id=0001 and sb_id=0002 are default preset id.

Also use id_analysis = “OFF”, If this flag is off, this short code work as normal ID preset type.

Using ID preset type, line’s oreder is little bit upset. Why?

We know this sympton, and couldn’t pursue the exact cause of it. One of example is below,

[speech_bubble_preset id_analysis="ON"]
[speech_bubble_id sb_id=11]Ask something. [/speech_bubble_id]

Result of above code.


We have Two solution for this

Solution 1. Use all FIRST,SECOND,THIRD in speech_bubble_preset shortcode.

[speech_bubble_preset id_analysis="ON"]
[speech_bubble_id sb_id=11]Ask something. [/speech_bubble_id]

Solution 2. Use FIRST,SECOND in speech_bubble_preset shortcode, and THIRD is used in lower outside of shortcode.

[speech_bubble_preset id_analysis="ON"]
[speech_bubble_id sb_id=11]Ask something. [/speech_bubble_id]
THIRD(outside of shortcode)


Great plugin!

At first it was hard to get the images figured out. But it all worked out.

For anyone interested you can download a different plugin to help you upload media to any file you desire. If you know what you’re doing with web, you can just do it directly with your FTP server, but otherwise try this free plugin that helped me:

“Upload Url and Path Enabler” by “Grégory Viguier”

This plugin will automatically make this file path, and you need to upload the pics you want to this url:

http://[YOUR WEBSITE NAME].com/wp-content/plugins/speech-bubble/img/

And your file names will be something like this:

http://[YOUR WEBSITE NAME].com/wp-content/plugins/speech-bubble/img/[FILE NAME]-150×150.png

Make sense?

So here is an example of the shortcode I use:

[speech_bubble type=”ln” subtype=”a” icon=”rvw_crtc_01.png” name=”Review Critic #1″ ]

Also, all the shortcodes and examples can be found here:

Good luck and hope you enjoy this plugin as much as I do 🙂



Speech bubble (ふきだしプラグイン) はオープンソースソフトウェアです。以下の人々がこのプラグインに貢献しています。



var 1.0.3 – Bug Fix

  • type: fb_flat bug fix. sb-type-fb-falt.css had a bug that “}” was missing in 294 line. reported by junon. Thanks!

var 1.0.2 – Bug Fix

  • subtype L1,R1,L2,R2 and left1, rigth1, left2, right2 were unavailable in single shortcode.

var 1.0.0 – Newly created

  • 9 design patterns are available
  • 9 pattern :std, fb, fb_flat,ln,ln_flat,pink, rtail,drop, think
  • 2 type short codes are available
  • 2 type : “Quick”, “ID preset”