会話形式でブログを表示できるプラグインSpeechBubbleが面白い

maruboro
ブログで毎月10万円の副収入を稼ぎたい!
お師匠
とにかく記事を書け!

 

こんなふうに「会話形式でブログを表示できるプラグイン」を発見しました。

プラグイン名は「Speech Bubble」。

これは面白いですね!見栄えも良くなるし「読みやすい」ですよね。

みなさんも会話形式でブログを表示できるプラグイン「Speech Bubble」を使ってみてはいかがでしょうか?

ということで「Speech Bubble」のインストール方法や使い方について書いていきたいと思います。

スポンサーリンク

Speech Bubbleのインストール方法

Speech Bubbleのインストールは管理画面から「プラグイン→新規追加→Speech Bubbleを検索」します。

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-10-02-22-30-48

画像では「有効」となっている右上のボタンが「今すぐインストール」となっているのでクリックしてインストールしましょう。

インストールしてプラグインを「有効」にすれば設定が完了です。

超簡単ですね!

Speech Bubbleの使い方

Speech Bubbleの使い方をいくつか説明します。

投稿画面でショートコードを記入するだけ

Speech Bubbleの使い方は超簡単です。投稿画面でショートコードを入力するだけです。

[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]

上記のショートコードを入力するとこんな感じになります。

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

名前の変更方法

名前を変更したい場合は「name=”A”」や「name=”B”」の部分のAとBを変更します。

例えばAを「ブラピ」、Bを「アンジェ」としましょう。すると次のような感じになります。

ブラピ
〇〇〇〇〇〇〇〇〇〇
アンジェ
〇〇〇〇〇〇〇〇〇〇

会話の変更方法

会話を変更したい場合は「〇〇〇〇〇〇〇〇〇〇」の部分を変更します。

入力したい言葉を入れましょう!

例えば「俺たちやり直さないか?」「考えさせて…」と入力してみます。

ブラピ
俺たちやり直さないか?
アンジェ
考えさせて…

画像の変更方法

画像を変更したい場合は「icon=”1.jpg”」や「icon=”2.jpg”」の部分の1.jpgと2.jpgを変更します。

この設定は少し難しいので詳しく書いていきます。

FTPツールを利用する場合

CyberduckなどのFTPツールを利用する場合は「ドメイン→public_html→wp-content→plugins→speech-bubble→img」の順でフォルダを開いていき、imgの中に画像をアップロードします。

画像をアップロードしたら1.jpgや2.jpgの部分をアップロードした画像のファイル名に変更します。

FTPツールの使い方や設定方法がわからないという方は次の記事を参考にすると良いでしょう。

エックスサーバーを利用する場合

エックスサーバーを利用している場合は「インフォパネルへログイン→ファイルマネージャへログイン→ドメイン→public_html→wp-content→plugins→speech-bubble→img」の順でフォルダを開いていき、imgの中に画像をアップロードします。

画像をアップロードしたら1.jpgや2.jpgの部分をアップロードした画像のファイル名に変更します。

ファイル名を入力し画像を変更すると次のようになります。

ブラピ
俺たちやり直さないか?
アンジェ
考えさせて…

他のサーバーもドメイン名のフォルダへ入っていき、同じように設定すれば大丈夫だと思います。

ぼくが使っているサーバーがエックスサーバーなので他のサーバーは未確認です。

立ち位置を変える方法

立ち位置を変える場合は「subtype=”L1″」と「subtype=”R1″」のL1とR1を変えるだけです。

L1にすると左側へ、R1にすると右側へ移動します。

ブラピ
俺たちやり直さないか?
アンジェ
考えさせて…

吹き出しの種類は9つ

吹き出しの種類は9つあります。「type=”drop”」のdropの部分を「drop・std・ fb・ fb-flat・ln・ ln-flat・ pink・ rtail・ think」に変えて使い分けるだけです。

drop

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

std

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

fb

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

fb-flat

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

ln

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

ln-flat

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

pink

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

rtail

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

think

A
〇〇〇〇〇〇〇〇〇〇
B
〇〇〇〇〇〇〇〇〇〇

まとめ

以上が「Speech Bubble」のインストール方法や使い方です。

簡単な設定でブログの見栄えが良くなるし、文章の構成方法も変えられるので便利ですよね。

みなさんも是非使ってみてください。面白いですよ!

スポンサーリンク

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です