WordPressにフキダシを作るSpeechBubble

WordPressにフキダシをつけるプラグイン!

記事を書いていると、WordPressにフキダシをつかった表現をしてみたいことがあるかと思います。あのLINEとかFacebookメッセンジャーみたいな感じをイメージした近代的なコンテンツにしたいんですね。

残念ながら、標準の機能では、そんなことはできません。

そのため、フキダシを実現するSpeechBubbleプラグインを導入してみます。

投稿画面ではどうやって使うの?

グラフィカルに作成することができないので、一通りの方法は暗記しましょう。
あなたが賢ければ、このコードを読むだけで全て理解できるはず!

[speech_bubble type="fb" subtype="L1" icon="1.jpg" name="せんせい"]きょうはさんたんげんのえすについてまなびます。[/speech_bubble]
[speech_bubble type="fb" subtype="R2" icon="2.jpg" name="せいと1"]すやすや~。[/speech_bubble]

[speech_bubble type="fb" subtype="L1″ icon="1.jpg" name="せんせい"]きょうはさんたんげんのえすについてまなびます。[/speech_bubble]
[speech_bubble type="fb" subtype="R2″ icon="2.jpg" name="せいと1"]すやすや~。[/speech_bubble]

フキダシの設定

フキダシの種類

このプラグインではいくつかのフキダシパターンが用意されている。
フキダシパターンはコード中の「type="~"」の部分で指定できる。

[speech_bubble type="drop" subtype="L1″ icon="1.jpg" name="せんせい"]これは「type="drop"」指定した場合。[/speech_bubble]
[speech_bubble type="std" subtype="L1″ icon="1.jpg" name="せんせい"]これは「type="std"」指定した場合。[/speech_bubble]
[speech_bubble type="fb" subtype="L1″ icon="1.jpg" name="せんせい"]これは「type="fb"」指定した場合。[/speech_bubble]
[speech_bubble type="fb-flat" subtype="L1″ icon="1.jpg" name="せんせい"]これは「type="fb-flat"」指定した場合。[/speech_bubble]
[speech_bubble type="ln" subtype="L1″ icon="1.jpg" name="せんせい"]これは「type="ln"」指定した場合。[/speech_bubble]
[speech_bubble type="pink" subtype="L1″ icon="1.jpg" name="せんせい"]これは「type="pink"」指定した場合。[/speech_bubble]
[speech_bubble type="think" subtype="L1″ icon="1.jpg" name="せんせい"]これは「type="think"」指定した場合。[/speech_bubble]

話者設定

フキダシを使うと、左側と右側の話者を分けたいですよね。
これは「subtype="~"」で設定できます。
なぜかフキダシの尻尾形状も、このパラメータで設定します。
プラグイン設計者の考え方はよく理解できません。

[speech_bubble type="ln" subtype="L1″ icon="1.jpg" name="せんせい"]これは「subtype="L1″」指定した場合。[/speech_bubble]
[speech_bubble type="ln" subtype="L2″ icon="1.jpg" name="せんせい"]これは「subtype="L2″」指定した場合。[/speech_bubble]
[speech_bubble type="ln" subtype="R1″ icon="2.jpg" name="せいと1"]これは「subtype="R1″」指定した場合。[/speech_bubble]
[speech_bubble type="ln" subtype="R2″ icon="2.jpg" name="せいと1"]これは「subtype="R2″」指定した場合。[/speech_bubble]

まとめ

他にもパラメータがありますが、基本的には使わないでしょう。
画像アイコンの差し替えかたは、ちょっと面倒なので、ここでは紹介しません。
記事の表現力が遥かにアップするSpeechBubbleはお勧めです!

特集記事

Posted by @erestage