「Speech bubble」プラグインを使うと、FBやLINEなどのように会話が見やすくなります。
また、キャラクターや名前を設定できるので、会話の掛け合いもスムーズに表現できます。
Speech bubbleのインストール
管理画面から検索してインストール、または、WordPress.org からダウンロードし、アップロードしてインストールして下さい。
管理画面から検索してインストール
- WordPress管理画面 > プラグイン > 新規追加 >「Speech bubble」で検索
- WordPress.org からダウンロード
- 「今すぐインストール」をクリック
- プラグインを有効化する
WordPress.org からインストール
- WordPress.orgから、「Speech bubble」のzipファイルをダウンロード
- ダウンロードしたファイルを解凍
- FTPソフトなどで、WordPressの「plugin」フォルダ内にアップロード
- WordPressの管理画面から「プラグイン」を選択
- プラグインを有効化する
Speech bubbleのバリエーション
[speech_bubble type=”ln” subtype=”L1″ icon=”616.png” name=”みのり”]Speech bubbleを使えばこんな風に会話が表示できるよ。[/speech_bubble]
[speech_bubble type=”ln” subtype=”R1″ icon=”682.png” name=”コメ吉”]なるほど、これは見やすいね。[/speech_bubble]
[speech_bubble type=”ln” subtype=”L1″ icon=”616.png” name=”みのり”]バリエーションもいろいろあるよ。[/speech_bubble]
スタンダード type=”std”
[speech_bubble type=”std” subtype=”L1″ icon=”616.png” name=”みのり”]これがスタンダードだよ。[/speech_bubble]
[speech_bubble type=”std” subtype=”R1″ icon=”682.png” name=”コメ吉”]とてもシンプルだね。[/speech_bubble]
ドロップ type=”drop”
[speech_bubble type=”drop” subtype=”L1″ icon=”616.png” name=”みのり”]これはドロップタイプだよ。[/speech_bubble]
[speech_bubble type=”drop” subtype=”R1″ icon=”682.png” name=”コメ吉”]これがドロップか。[/speech_bubble]
ラッテ type=”rtail”
[speech_bubble type=”rtail” subtype=”L1″ icon=”616.png” name=”みのり”]これはラッテタイプだよ。[/speech_bubble]
[speech_bubble type=”rtail” subtype=”R1″ icon=”682.png” name=”コメ吉”]rtailはスコットランド・ゲール語らしいぞ。[/speech_bubble]
Pink type=”pink”
[speech_bubble type=”pink” subtype=”L1″ icon=”616.png” name=”みのり”]これはPinkタイプだよ。[/speech_bubble]
[speech_bubble type=”pink” subtype=”R1″ icon=”682.png” name=”コメ吉”]強調するときにいいね。[/speech_bubble]
考えてる風 type=”think”
[speech_bubble type=”think” subtype=”L1″ icon=”616.png” name=”みのり”]これはThinkタイプだよ。[/speech_bubble]
[speech_bubble type=”think” subtype=”R1″ icon=”682.png” name=”コメ吉”]これはいいね。[/speech_bubble]
フェイスブック風 type=”fb”
[speech_bubble type=”fb” subtype=”L1″ icon=”616.png” name=”みのり”]これはFB風。[/speech_bubble]
[speech_bubble type=”fb” subtype=”R1″ icon=”682.png” name=”コメ吉”]いいかんじだね。[/speech_bubble]
フェイスブック風 フラットタイプ type=”fb-flat”
[speech_bubble type=”fb-flat” subtype=”L1″ icon=”616.png” name=”みのり”]これがフェイスブックフラットタイプ。[/speech_bubble]
[speech_bubble type=”fb-flat” subtype=”R1″ icon=”682.png” name=”コメ吉”]フラットになったね。[/speech_bubble]
LINE風 type=”ln”
[speech_bubble type=”ln” subtype=”L1″ icon=”616.png” name=”みのり”]これがLINE風。[/speech_bubble]
[speech_bubble type=”ln” subtype=”R1″ icon=”682.png” name=”コメ吉”]なるほど、これは馴染み深いね。[/speech_bubble]
LINE風 フラットタイプ ln-flat
[speech_bubble type=”ln-flat” subtype=”L1″ icon=”616.png” name=”みのり”]これがLINE風フラットタイプ。[/speech_bubble]
[speech_bubble type=”ln-flat” subtype=”R1″ icon=”682.png” name=”コメ吉”]なるほど、雰囲気変わるね。[/speech_bubble]
Speech bubbleの使い方
プラグインをインストールして有効にした後は、ショートコードを貼り付けて会話を書いていくだけです。
注.[]を【】に変えて表示しています。
【speech_bubble type=”○○” subtype=”○○” icon=”画像ファイル” name=”名前”】ここに文章を記述します。【/speech_bubble】
会話タイプの指定
type=”○○”で表示させる会話のタイプを指定します。
考えるタイプの指定
subtype=”○○”はL1の指定で左からの会話、R1の指定で右からの会話になります。
subtype=”L2″、”R2″を指定すると、その会話タイプのまま考えるタイプにできます。
キャラクター画像の設定
FTPで画像をアップロードする
アップロードする場所は、Wordpressホルダー下にある、speech-bubbleプラグインのイメージホルダーになります。
「ドメイン」>「public_html」>「wp-content」>「plugins」>「speech-bubble」>「img」
imgホルダーにアップロードした画像名の名前を「icon=”○○”」の部分に入れましょう。
その際、拡張子も忘れずに記述してください。
画像は勝手に100×100pxにリサイズされますので、大きい画像でも大丈夫です。
セリフの入れかた
セリフは下の箇所に記述するだけです。
【speech_bubble ・・・】セリフを記述する箇所です。【/speech_bubble】
キャラクター名の指定
キャラクター名は「name=””」の部分に指定します。
ショートコードを入れるだけで簡単に会話モードになります。ショートコードはAdd Quick Tagに登録しておけば素早く呼び出すことができます。