ブログに吹き出しを入れて会話風に!プラグイン「Speech Bubble」の使い方

lgf01a201407170500

今回は、ずっと前から気になっていた吹き出しプラグイン「Speech Bubble」をインストールしてみました。

これは、記事中にラインやFBのようなチャットが表示が出来るので、とっても便利なプラグインなんです。

使い方は本当に簡単なので、必要であればインストールして使ってみましょう(*^o^*)

スポンサーリンク
トップページ 広告W336×280

インストール

まず、「ダッシュボード」→「プラグイン」→「新規追加」で「Speech Bubble」と検索し、インストールしたあとに有効化しましょう。

スクリーンショット 2016-04-29 2.39.24

使い方

有効化したあとの設定は特になく、ただ吹き出しを入れたい投稿の編集画面にこちらのコードをコピペするだけ。

(このとき、テキストモードに貼り付けましょう)

そうすると、このような表示になります。

スクリーンショット 2016-04-29 3.04.41

Aさん、Bさんの部分を任意の名前に変更し、セリフも各々変更することも可能です。

スクリーンショット 2016-04-29 3.09.24

とっても便利ですね(*^o^*)♪

吹き出しのデザイン変更方法

嬉しいのが、吹き出しのデザインを変更することが出来てしまう点。

方法は簡単で、コードの「type=”◯◯◯”」の◯◯◯部分を任意のものに変更するだけでOKです!!

どんな風になるのかやってみました。

「drop」

スクリーンショット 2016-04-29 3.09.24

「std」

スクリーンショット 2016-04-29 3.16.55

「fb」

スクリーンショット 2016-04-29 3.20.12

「fb-flat」

スクリーンショット 2016-04-29 3.21.42

「ln」

スクリーンショット 2016-04-29 3.22.44

「ln-flat」

スクリーンショット 2016-04-29 3.23.41

「pink」

スクリーンショット 2016-04-29 3.24.37

「rtail」

スクリーンショット 2016-04-29 3.25.26

「think」

スクリーンショット 2016-04-29 3.26.18

いろいろなレパートリーがあって面白いですね(*^o^*)

吹き出しの向きも変更出来ます。

コードの「subtype=”◯◯◯”」の◯◯◯部分を変えるだけでOKです!!

「R1」「R2」「L1」「L2」の4つの中から任意で設定しましょう。

(ちなみにRは右側、Lは左側を表します)

スクリーンショット 2016-04-29 3.39.14

画像の入れ方

次に、任意の画像にする方法です。

このような感じに。

スクリーンショット 2016-04-29 3.49.10

まず、サーバーのFTPへ行き、「wp-content」→「plugins」→「speech-bubble」→「img」へ進みます。

そして、設定したい画像をアップロードしましょう。

(ロリポップの場合は、左上に「アップロード」ボタンがありますよ!!)

スクリーンショット 2016-04-29 3.53.07

任意のファイルを選択し、アップロードしましょう。

アップロードが完了したら、ファイル名をコピーして、コードの「icon=”◯◯◯”」の◯◯◯に貼り付ければOKです。

簡単です(*^o^*)

まとめ

これを使えば、記事の中に会話形式を取り込んだり出来るので、今までと違った書き方が出来そうで楽しみです(*^^*)

いろいろと挑戦し、サイトに訪れてくれた方にとって更に読みやすい記事になるよう工夫していきたいと思います。

この記事を読んでいただき、どうもありがとうございました!!

またお会いしましょう(*^o^*)

ブログに吹き出しを入れて会話風に!プラグイン「Speech Bubble」の使い方
この記事をお届けした
ポントピの最新ニュース情報を、
いいねしてチェックしよう!
スポンサーリンク
トップページ 広告W336×280
トップページ 広告W336×280

役に立ったらからシェア♪

気になるからフォロー♪

トップへ戻る