
ワードプレスで会話調の表示ができるプラグイン、Speech bubble (ふきだしプラグイン)が、使ってみると結構面白いので、ちょっとはまっている。
普通に2名とかの会話が、吹き出しで表示されるので、説明書きなどで使うと視覚的な効果もあってとてもよいと思います。
プラグインインストール
インストールと有効化は、普通の通りです。
Speech bubble でプラグイン検索かけて、インストールと有効化をします。
プラグイン使用方法
1 2 |
[speech_bubble type="drop" subtype="L1" icon="1.jpg" name="A さん"] おこんばんわ [/speech_bubble] [speech_bubble type="drop" subtype="R1" icon="2.jpg" name="B さん"] おばんです [/speech_bubble] |
こんな感じである。
typeで形等を指定,subtypeで方向を指定,iconでアイコン指定,nameで表示する名前を指定します。
プラグイン使用方法:typeの違い
drop, std, fb(FaceBook風), fb-flat, ln(LINE風), ln-flat, pink, rtail, think と各タイプがあります。
drop
std
fb
fb-flat
ln(LINE風)
バグ修正:speech-bubble/css/sb-type-ln.css 216行目あたり、speech-bubble/css/sb-type-ln.css
background-color: #FCFCFC; => #bbff77 にします。
ln-flat
pink
rtail
think
プラグイン使用方法:subtypeの違い
L1
R1
L2
R2
プラグイン使用方法:subtypeの違いアイコンの変更方法
正式な方法
\wp-content\plugins\speech-bubble\img\ の中に、アイコンをFTPでアップロードして、画像を使用
その他の方法
通常にアップロードした、画像のURL指定をする場合
プラグイン編集で、speech-bubble/classes/SnbSpeechBubble.php を編集します。
115行目 $sb_icon_path = plugins_url( self::PLUGIN_FOLDER_PATH_IMG . $user_icon );
これを、下記のような、ダイレクトURL指定に変更します。
$sb_icon_path = $user_icon ;
以上お愉しみください。
作者さんのページはこちら
http://www.arisoude-nakatta.com/