超おすすめ!WordPressで吹き出しが使えるプラグイン見つけました
2015/01/31
やっと見つけた!
LINEやFacebookみたいな会話をブログで使う事ができる、めちゃくちゃ便利な吹き出しプラグインを見つけました。
今回は、こんなふうに漫画風や会話風にブログを進行することができるようになるワードプレスのプラグイン『Speech Bubble』というプラグインのインストール方法&使い方をご紹介します。
スポンサードリンク
この記事のもくじ
Speech Bubbleのインストールの手順
「Speech Bubble」はプラグインなので、基本的にインストール方法は他のプラグインと同じです。
念のために図解します。
手順1)ダッシュボードの「プラグイン」
手順2)「新規追加」から右の検索窓に「Speech Bubble」と入力してENTER
手順3)Speech Bubbleが出てきますので、「今すぐインストール」をクリック
手順4)「プラグインを有効化」をクリック
以上でプラグインのインストールと有効化が終わりました。
吹き出しプラグインSpeech Bubbleを使って投稿をする方法
いつも通りブログを書く手順で「投稿」⇒「新規投稿」を選びます。
ビジュアルモードでも、テキストモードでも両方使用可能でした。
この新規投稿画面に以下のコードをコピペしてみてください。
|
1 2 |
[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] |
これを貼り付けてもらうと↓こんな風になる。
セリフの変更の仕方
|
1 2 |
[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さんのセリフは↑のコードの●●●●●の部分を変えればOK。同じくBさんのセリフは↑のコードの×××××の部分を変えればOK。
キャラの名前の変更方法
|
1 2 |
[speech_bubble type="drop" subtype="L1" icon="1.jpg" name="■さん"] おっす! [/speech_bubble] [speech_bubble type="drop" subtype="R1" icon="2.jpg" name="◎さん"] なんだちみは!?[/speech_bubble] |
キャラの名前が今は「Aさん」「Bさん」になってるけど、これも↑のコードの【name=”■さん”】のところ、「■さん」「◎さん」を変更すれば自由に設定できる。
吹き出しの種類の変更方法
実は吹き出しの種類も9種類用意されている。いいねいいね!!
9種類は↓のコードの【type=”drop”】の部分を変更すればOK。デフォルトはdropになっている。
|
1 2 |
[speech_bubble type="drop" subtype="L1" icon="1.jpg" name="■ さん"] おっす! [/speech_bubble] [speech_bubble type="drop" subtype="R1" icon="2.jpg" name="◎ さん"] なんだちみは!?[/speech_bubble] |
9種類のコードはdrop・std・ fb・ fb-flat・ln・ ln-flat・ pink・ rtail・ thinkのどれかを選べばいい。
ちなみにそれぞれがどんな感じになるかというと↓
drop
std
fb
fb-flat
ln
ln-flat
pink
rtail
think
人物の向きと、吹き出しのしっぽの種類の変更方法
|
1 2 |
[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] |
キャラを左に置くか、右に置くかは【subtype=” ”】の部分で変更します。
また、吹き出しのしっぽも同じく【subtype=” ”】の部分で変更します。
L1⇒人物が左側に配置、吹き出しのしっぽは「話す」感じになる
L2⇒人物が左側に配置、吹き出しのしっぽは「考える」感じになる
R1⇒人物が右側に配置、吹き出しのしっぽは「話す」感じになる
R2⇒人物が右側に配置、吹き出しのしっぽは「考える」感じになる
アイコン画像(キャラとかの画像)の変更方法
デフォルトの設定では、こんなシンプルな感じのアイコンになっています↓
それを、今回僕が使用した「佐伯さん」「長野さん」みたいに、あなたの好きな画像や写真に変更することができます。
アイコン画像の変更手順
手順1)あなたの使用しているサーバーのWordPressのフォルダの中の「speech-bubble」の中の「img」フォルダを探します。
例:ドメイン>public_html>wp-content>plugins>speech-bubble>img
手順2)使用したいアイコン画像(jpg, png, gif, svg, tif)を、そのimgフォルダ内にアップロードします。(ファイル名は半角英数字を使ってください)
手順3)このSpeech Bubbleの【icon=” ○○.jpg“】の部分で、先ほどアップロードしたファイル名を指定してあげればOKです。
|
1 2 |
[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] |
※画像サイズは大きくても勝手にリサイズされて、ちょうどいい大きさに変更されますので、画像編集の際に、サイズ変更などしなくても大丈夫です。
ありがたい事に、吹き出しの中の文字はテキストになっている
そうなんです。これがめちゃくちゃありがたい。
SEO的にはこれがテキストであることがありがたやなんです。
SEOって何?っていうあなたは、SEOの基本について書いた記事を参考にしてください。
キャラを増やせばこんな風なブログもできる
※この人たちがどんなキャラなのか知りたいあなたは佐伯さんたちを使った漫画の原稿の使い方の記事を見てみてね。
まとめ
いやー、またまたブログの幅が広がりました。
是非あなたもこのSpeech Bubbleというプラグインを活用して面白いブログを書いてみて下さい。
面白いブログの書き方は
⇒面白いブログの書き方!熱烈ファンを獲得する9つの必殺技を参考にしてみて下さい。
ブログって実はこういう人に楽しんでもらえるようなコンテンツを作れるようにならないといけない時代に来ています。
もちろんコツコツとSEO対策をして、検索流入を増やすことも必要ですが、SNSというメディアがあるので、面白いコンテンツを提供してマーケティングに活かさない手はありません。
そんなコンテンツマーケティングについても僕のつくったブログマーケティングスクールで学ぶことができます。どうぞ興味があればのぞいてみて下さい。
じゃあね!バイチャ!