多くのサイトでよく会話形式のやりとりを見ることってありますよね？
ワードプレスの有料テーマであれば当然最初から機能が装備されているものが多いですが、実は無料のプラグインでもできます。
今回の記事では無料のブラグイン「Speech Bubulle」のインストールから使い方までの手順をご紹介します。
目次
Speech Bubulleってどんなやつ？
上の画像のような会話形式のやりとりが、なんと無料でできます。
簡単に会話形式のブログを書くことができ、吹き出しの形など自由に変えることができるんです。
会話形式のやりとりをブログに入れるには以下のようなメリットがあります。
〇読者が見やすくなる
〇読者の目を引きやすくなる
ブログを書いている人の多くは「独自性」に悩み、流し読みされて閉じられるという壁に当たります。
そこでこのSpeech Bubulleを使用することで、あなただけの独自性や流し読みストップの効果をだすことができます。
それではまずはインストールしてみましょう！
Speech Bubbleをインストール
ワードプレスの管理画面にログインし、ダッシュボードの「プラグイン」の所で「新規追加」をクリックします。
そして、キーワードの所で「Speech Bubulle」と検索すると、下の画像のような画面がでてきますので「いますぐインストール」をクリックしましょう。
インストールしたら、管理画面の「ブラグイン」→「インストールプラグイン」→プラグインを有効化という手順でクリックしていきます。
実際に会話形式で書いてみる
入力はビジュアルでもテキストでもどちらでも大丈夫なので、以下のコードをコピペしてみてください。
|
1 2 |
[speech_bubble type="drop" subtype="L1" icon="1.jpg" name="旦那様"] プラグインSpeech Bubbleをｲﾝｽﾄｰﾙするとこんなことができるよ [/speech_bubble] [speech_bubble type="drop" subtype="R1" icon="2.jpg" name="奥様"] ちゃんと詳しく説明してね[/speech_bubble] |
すると、デフォルトの画像で会話形式が表示されます。
画像を変更
次に画像を変更する手順を紹介します。
Speech Bubulleでは、普段アップロードしている場所とは違う所から呼び出すようになります。
一般的にはやり方は大きく2つあります。
- FFFTPを使用して画像をアップロード
- サーバーのサイトから画像をアップロード
僕は手順が簡単なFFFTPからアップロードしているので、そちらの方法をご紹介します。
FFFTPを無料インストールする
まずはコチラのサイトからFFFTPをインストールしましょう。
画面に従って進んでいくと、下のような画像がでます。
デスクトップ上にショートカットを作成するにチェックを入れておきましょう。
すべて完了すると、デスクトップにこのようなアイコンがでてきます。
これでインストールは完了です。
FFFTPの初期設定
FFFTPを利用するには、初期設定をしなければいけません。
僕はサーバーをエックスサーバーを利用しているので、エックスサーバー画面による設定方法を載せていきます。
先ほどデスクトップに表示した「FFFTP」のアイコンをクリックすると、次のような画面がでてきますので
「新規ホスト」をクリックしましょう。
入力を赤丸部の4か所のみです。
- ホストの設定名(T)
- ホスト名(アドレス)(N)
- ユーザー名(U)
- パスワード
最初の「ホストの設定名(T)は適当でかまいませんが、僕の場合は「エックスサーバー」と入力しています。
これらの情報はサーバーにログインして調べれます。
サーバーパネルにログインし、「FTPアカウント設定」をクリック
そのあとは自分の独自ドメインを選択し、「FTPソフト設定」をクリック
自分の情報が入力されるのでFTP画面に入力していきましょう。
パスワードはサーバーパスワードと同じです。
初期フォルダなどはなにも設定しなくていいので、「OK」をクリック
〇ユーザー名はサーバーID(ｻｰﾊﾞｰに入ると記載有)
〇ホスト名はサーバーのサイトの中にあるホスト名をそのまま入力
〇初期フォルダは空白のままでOK
FFFTPサーバーに画像を入れる
FFFTPの最初の画面に戻ると、先ほど設定した名前が追加されてます。
設定が間違っていなければ、「接続」をクリックするとサーバーとFFFTPが接続されます。
左側はパソコンの情報が表示され、右側がサーバー側の情報が表示されます。
ここからは収納したいフォルダまでひたすらクリックです！
ワードプレスで使用しているサーバー
- public_htm
- wp-content
- plugins
- speech-bubbl
- img
この中に自分の入れたい画像をドラッグアンドドロップ
これで完了です。
ワードプレスにコードを入力
それではワードプレスの投稿画面に戻りましょう。
やり方は簡単です。先ほど保存したコード名を入力するだけです。
“〇〇”name の〇〇の言葉を先ほどFFFTPに保存した名称を記載するだけです。
僕の場合はD1という名前で保存しました。(.jpgなどの拡張子までそのまま同じように入力必要)
ちなみに、FFFTPに画像を入れるときは英語でもひらがなでもOKでした!ただし、保存した名前とワードプレスで入力する名前は必ず同じ名前で入力しましょう。
ｺｰﾄﾞ例)
|
1 |
speech_bubble type="drop" subtype="L1" icon="D1.jpg" name="旦那さま"] 画像が変わった![/speech_bubble] |
名前やセリフを変更
名前やセリフを変えるのは非常に簡単です。
<名前の変え方>
name=”〇〇”の〇の所を変更すると名前が変わります。
<セリフの変え方>
名前のあとにある
]〇〇[の〇の所を変更するとセリフが変わります。
試しに名前とセリフを変えてみると
|
1 2 |
[speech_bubble type="drop" subtype="L1" icon="D1.jpg" name="先生"] それでは教科書を読んでください[/speech_bubble] [speech_bubble type="drop" subtype="R1" icon="01.jpg" name="生徒"] 自分で読んでください[/speech_bubble] |
吹き出しの種類
吹き出しの種類は9種類あります。
- 「drop」
- 「std」
- 「fb」
- 「fb-flat」
- 「in」
- 「in-flat」
- 「pink」
- 「rtail」
- 「think」
type=”drop”のdropを変えることで変更することができます。
「drop」
「std」
「fb」
「fb-flat」
「In」
「In-flat」
「pink」
「rtail」
「think」
やってみると非常に楽しいです☆
無料で使用できるので、興味のある方はぜひ一度使ってみることをおすすめします!
おすすめのポイントサイト
広告還元率、ゲーム、全てが高レベル！
ゲームで楽しく貯めるならげん玉！
楽天市場を利用するならちょびリッチがおすすめ
新着エントリー
おすすめ記事
海外に行くならグローバルWi-Fi
スーツケースの選び方
モッピーの安全性
大人気ちょびリッチ
げん玉って？
