さらに吹き出しを増やしました

前回までのお話

前回までの２回で、アイコンから吹き出しが出て会話風にするというカスタマイズを行ってきました。

吹き出しのバリエーションを増やしてみました。

前回、アイコン画像と吹き出しが出るようにしてみました。今回は、それをバージョンアップして、色々なアイコン画像を簡単に出るような仕組みを構築したんですよ。

web.no-koto.net

さらに吹き出しを追加

これまで追加したアイコンに、色々な表情や動きのあるアイコンを追加することで、より見やすい記事になるかな〜なんて思って、バリエーションを増やしてみました。

ここから、追加した吹き出しです。

まりん

[fukidashi txt="marine-dameda.png" img="/images/icon/marine-dameda.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-hirameki.png" img="/images/icon/marine-hirameki.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-kangaeru.png" img="/images/icon/marine-kangaeru.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-kannsinn.png" img="/images/icon/marine-kannsinn.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-keibetu.png" img="/images/icon/marine-keibetu.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-kimarine.png" img="/images/icon/marine-kimarine.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-komatta.png" img="/images/icon/marine-komatta.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-kusyou.png" img="/images/icon/marine-kusyou.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-nemui.png" img="/images/icon/marine-nemui.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-neru.png" img="/images/icon/marine-neru.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-odoroki.png" img="/images/icon/marine-odoroki.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-ohoho.png" img="/images/icon/marine-ohoho.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-poripori.png" img="/images/icon/marine-poripori.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-shiawase.png" img="/images/icon/marine-shiawase.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-suteki.png" img="/images/icon/marine-suteki.png" fuki="left" speaker="まりん"]

[fukidashi txt="marine-yubisasi.png" img="/images/icon/marine-yubisasi.png" fuki="left" speaker="まりん"]

ゆい

[fukidashi txt="yui-dameda.png" img="/images/icon/yui-dameda.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-hirameki.png" img="/images/icon/yui-hirameki.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-itai.png" img="/images/icon/yui-itai.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-kangaeru.png" img="/images/icon/yui-kangaeru.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-kansin.png" img="/images/icon/yui-kansin.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-keibetu.png" img="/images/icon/yui-keibetu.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-kimarine.png" img="/images/icon/yui-kimarine.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-komatta.png" img="/images/icon/yui-komatta.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-kusyou.png" img="/images/icon/yui-kusyou.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-mattari.png" img="/images/icon/yui-mattari.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-negao.png" img="/images/icon/yui-negao.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-nemui.png" img="/images/icon/yui-nemui.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-odoroki.png" img="/images/icon/yui-odoroki.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-ohoho.png" img="/images/icon/yui-ohoho.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-okoru.png" img="/images/icon/yui-okoru.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-poripori.png" img="/images/icon/yui-poripori.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-suteki.png" img="/images/icon/yui-suteki.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-warau.png" img="/images/icon/yui-warau.png" fuki="left" speaker="ゆい"]

[fukidashi txt="yui-yubisasi.png" img="/images/icon/yui-yubisasi.png" fuki="left" speaker="ゆい"]