吹き出しアバター用ショートコード

このショートコードを使用するにはDigiPressテーマ専用のプラグイン(有料)が必要です。

人物などの画像やアイコンに吹き出しを付けて任意のテキストを表示できるショートコードです。

吹き出し表示例

ここに吹き出しのテキストを表示します。

Code

[talk words="ここに吹き出しのテキストを表示します。" avatarimg="http://demo.dptheme.net/dp14/wp-content/uploads/sites/16/2015/11/girl.jpg"]

会話形式にした表示例

画像とテキストだけを指定してるよ。

Mr. Avatar

僕はアバターを右側にして名前を表示してみたよ！そうだなぁ、アバターは角丸にしてみよう！

ナンシー

じゃ、私はアバターを四角形にしてサイズを変えてボーダーを付けてみるわ。ついでに吹き出しのカラーも変えちゃう！
「これはリンク」みたいにHTMLも表示できるのよ！

Mr. Avatar

すごいじゃないか、ナンシー！

画像なし子

うーん、アバター画像なしの私は殺風景だ…

Code

[talk words="画像とテキストだけを指定してるよ。" avatarimg="http://demo.dptheme.net/dp14/wp-content/uploads/sites/16/2015/11/girl.jpg"]
[talk words="僕はアバターを右側にして名前を表示してみたよ！そうだなぁ、アバターは角丸にしてみよう！" avatarimg="http://demo.dptheme.net/dp14/wp-content/uploads/sites/16/2015/11/man.jpg" name="Mr. Avatar" avatarshape=2 align=r]
[talk words='じゃ、私はアバターを四角形にしてサイズを変えてボーダーを付けてみるわ。ついでに吹き出しのカラーも変えちゃう！
「<a href="#">これはリンク</a>」みたいにHTMLも表示できるのよ！' name="ナンシー" avatarimg="http://demo.dptheme.net/dp14/wp-content/uploads/sites/16/2015/11/girl.jpg" avatarsize=100 avatarbdcolor=#FF98A5 avatarbdwidth=4 avatarshape=3 color=#fff bgcolor=#FF95A1 bdcolor=#69EF54 bdstyle=3]
[talk words="すごいじゃないか、ナンシー！" avatarimg="http://demo.dptheme.net/dp14/wp-content/uploads/sites/16/2015/11/man.jpg" name="Mr. Avatar" align=r]
[talk words="うーん、アバター画像なしの私は殺風景だ..." name="画像なし子"]