Speech Bubbleの設定方法と使い方（文章を会話風にしてくれる、ふきだしプラグイン）

 

ブログやサイトに記事を投稿していると、たまに会話風にしてみたいときがある。

そこでさっそく、”会話風 プラグイン”でググッてみると「Speech Bubble」のプラグインが「いいよ」ということを知ったのである。

 

ここでは、Speech Bubbleの設定方法と使い方について紹介する。

 

Speech Bubbleとは

 

 

Speech bubble (ふきだしプラグイン) は、直接的なHTML&CSSコード化なしであなたのポストのスピーチ泡飾りを容易に追加できる。

 

と解説されている。

 

Speech Bubbleの設定方法と使い方

 

で、このプラグインのインストール方法については、管理画面（ダッシュボード）からプラグイン、新規追加に進む。

 

 

プラグインを追加の画面になったら、右上にある検索欄に「Speech Bubble」と入力する。

すると画面に「Speech Bubble」の項目がでてくるので、「今すぐインストール」ボタンをクリックする。

 

プラグインのインストール後は、有効化を選択する（画面上で有効化を選択する）。

 

設定方法と使い方

 

設定方法としては、「Speech Bubble」のショートコードをコピーして投稿ページや固定ページに貼り付けるだけである。

 

 

ショートコードについては、ここから持ってきた。

たったこれだけで、吹き出しとアイコンが現れる。

 

 

デフォルトではこんな感じになる。

私も最初、こうしたコードをコピーして、サイトに貼り付けたのだが、上手くサイトに反映されなかった。

なので、ヤフーとかグーグルの検索欄にコピーしたコードをぶち込んで、それをまたコピーして貼り付けると上手く行ったのである（メモ帳などの類でも可）。

 

吹き出しの変更

 

 

さっきのコードを少しわかりやすくしてみた。

 

 

そして、この吹き出し部分の変更をする時は、"std"の部分を変更する。

試しに"ln"に変えてみる。

 

 

するとLINE風の吹き出しになるのである。

その他にも

 

「drop」「std」「fb」「fb-flat」「ln-flat」「pink」「rtail」「think」

 

などの吹き出しがあるようだ、自分で好きなものを選んでくれ。

 

 

ちなみに心の声を表現したいときには、subtype=の部分を"c"と"d"に変更する。

単体で変えることも可能である。

 

 

 

会話内容の変更

 

 

会話内容を変更したいときには、name="A san" ]の後ろ部分を変更すればいい（Bも同じ）。

 

 

名前の変更

 

 

名前を変更したいときには、name="A san"のA sanの部分を変更する（Bも同じ）。

 

 

画像の変更方法

で重要な画像を変更する方法だが、まず画像を選んでおくことが必要になる。

 

選んだうえですることは、エックスサーバーにアクセスする。

そしてログインする。

 

 

ログイン後は、「ファイルマネージャー」にアクセスする。

 

 

ここでは、下記の通りに進んでいく。

 

 

 

img画面を開いたら、

ファイルのアップロードの下にある、「ファイルを選択」ボタンをクリックし、準備した画像を選択する。

 

 

画像を選んだら、「アップロード」ボタンを押す（一度に５つまで可能のようだ）。

 

 

そうしたら、画面上に画像が反映されたのが確認できる。

あとは、投稿ページや固定ページに戻って、ショートコードを書き換える。

 

 

 

icon="1.jpg"の「1.jpj」部分と、icon="2.jpg"の「2.jpg」部分をさっきアップロードした画像に書き換える。

すると、下記のようにアイコンが設定された画像に変更されるのである。

 

 

こんな風に、キャラクターのアイコンが表示される。

アイコンがつくだけで、それらしいものになる。

ちなみに文字は、テキストになるようだ。

以上で、Speech Bubbleの設定方法と使い方についての解説は終了する。