WordPress上でLINE風の吹き出し会話を作る方法!

アリスです。

WP上で吹き出し会話ができるプラグイン「Speech Bubble」の紹介をします

A san
吹き出しに自由にセリフを入れることが可能

B san
デフォルトはこんな感じ

LINE風の吹き出しがこれ↓。
名前やアイコンも自由に設定できる。

ジョナサン
君はディオ・ブランドーだね

ディオ
そういう君はジョナサン・ジョースター

左右のポジションも自由自在。

アニメ派のヤツには
若干のネタバレ注意だぜ・・・

ディアボロ
オレのそばに近寄るなああーーーーーーーーーッ

やり方は簡単。
下記のショートコードを貼って中身を編集するだけ。

スポンサーリンク

type の種類

type属性に指定する値によって、吹き出しのデザインやアイコンの形が変わります。

std (デフォルト)

ジョナサン
なっ!
何をするだァ―――ッ
ゆるさんッ!

ジョージ
息子がつかまるのを見たくないはない・・・

ジョナサン
なっ!
何をするんだァ―――ッ
ゆるさんッ!

ジョージ
息子がつかまるのを見たくはない・・・

fb (facebook風)

エリナ
きちっとやつけなさい!

タイトル
ジョナサン 最後の賭け

エリナ
きちっとやっつけなさい!

タイトル
ジョセフ 最後の賭け

fb-flat

花京院
わたしの幽波絞で!

承太郎
うっおとしいぜッ!!

花京院
わたしの幽波紋で!

承太郎
うっとおしいぜッ!!

ln (LINE風)

アヴドゥル
魔法使いの赤(マジシャンズ・レッド)

花京院
法皇の緑(ハイエロファント・エメラルド)

アヴドゥル
魔術師の赤(マジシャンズ・レッド)

花京院
法皇の緑(ハイエロファント・グリーン)

ln-flat

テニール船長
星の白金(スター・シルバー)

ホルホース
「9柱神」

テニール船長
星の白金(スター・プラチナ)

ホルホース
「9栄神」

pink

承太郎
おれの名は空条承太郎
なんつーか血縁上は おまえの
「叔父」ってやつになるのかな
・・・奇妙だが・・・

仗助
ンなこあ―― 大した事じゃあ ねェ――だろッ!

承太郎
おれの名は空条承太郎
なんつーか血縁上は おまえの
「甥」ってやつになるのかな
・・・奇妙だが・・・

仗助
ンなこた―― 大した事じゃあ ねェ――だろッ!

rtail

仗助
でらあっ

ジョルノ
違う人だ・・・ミスタ・・・

仗助
どらあっ

ジョルノ
違うんだ・・・ミスタ・・・

drop

リゾット
自転車の音なんかではない・・・

イルーゾォ
その「鏡」も もうおれがいただくぞッ!

リゾット
自動車の音なんかではない・・・

イルーゾォ
その「鍵」も もうおれがいただくぞッ!

think

エンポリオ
それだッ!!

ジョニィ父
ニコラスはおませのせいで死んだのだ

エンポリオ
それたッ!!

ジョニィ父
ニコラスはおまえのせいで死んだのだ

スポンサーリンク

subtype の種類

subtypeでは、左右のポジションや吹き出しの形を指定できる。
指定の方法はそれぞれ3種類あり、どれを使っても良い。

A san
L1、left1、a のいずれかを指定するとこんな感じ

A san
R1、right1、b のいずれかを指定するとこんな感じ

A san
L2、left2、c のいずれかを指定するとこんな感じ

A san
R2、right2、d のいずれかを指定するとこんな感じ

スポンサーリンク

icon の指定

アイコン画像を指定するには、「wp-content/plugins/speech-bubble/img/」に画像を入れておき、icon属性でファイル名を指定するだけ。
アイコン画像は表示される際に正方形に圧縮されるため、縦横の比率には注意。

スポンサーリンク

name の指定

name属性では、話している人の名前を指定できる。
名無しにしたい場合は、nameを空欄にするれば良い。
※name属性を消すと、「no name」という名前になってしまう。

スポンサーリンク
関連記事と広告