今回は、わたしがお世話になっているカミジョーさん(@MinatoWorks )にブログを書くときの小技をご紹介いただきます。
ワードプレスでテーマをSANGOにしている方は必見です。
簡単に真似できますので、やってみたくなること間違いなしです!
こんにちは、カミジョーです。
今回はミカコさんのミカコライフへ寄稿させて頂いています。
ミカコさんからのご要望で、
「初心者に優しいブログ運営」についての寄稿を、とのコトでしたので、
今回は「SANGOですぐにできる動く吹き出しアイコンの作り方」をご紹介していきます。
SANGOですぐに使える動く吹き出しがあると良い理由
ワードプレスの吹き出しについては、
もう数年前に
「Speech Bubble」
「LIQUID SPEECH BALLOON」
などの吹き出し用プラグインがリリースされ、
従来のテキストだけのコンテンツを更に読みやすくしました。
吹き出しにはキャラが登場するので、読者は吹き出しがあることで感情移入しやすかったり
また長文も読みやすいなどのメリットがあります。
吹き出し機能が使えるようになった当初は
・サーバにアイコン画像をUPしなくてはならない
・バリエーションが豊富ではない
・あまり世間から吹き出し自体が支持されていなかった
という状況でしたが、2019年になりずいぶん多くのブログで吹き出しを使用されるようになりました。
そして、今回はそんな吹き出し機能を更に進化させた動く吹き出しを作って見ることにしました。
- 目新しい吹き出しを作りたい
- 周りのサイトと差別化したい
- かわいいサイトにしたい
ということでご紹介していきます。
SANGOで動く吹き出しを作る方法
動く吹き出しを作る方法です。
1.SANGOの吹き出しのショートコードを使います
[say name="アイコンの名前" img="画像のURL"]ここに文章[/say]
SANGOですぐに吹き出しを呼び出すにはこういった形のショートコードを使用します。
2.使う画像を用意する
今回はせっかくなのでミカコさんのアイコンを使わせてもらいましょう
3.ぽよぽよGifメイカーで動くGif画像を作成する
ぽよぽよGifメイカーでは以下12種類の動くGif画像を作ることができます。
・ぴょこぴょこ
・きょろきょろ
・びょんびょん
・うろうろ
・ぽんぽん
・とんとん
・くるりん
・ぽゆんぽゆん
・ずんずん
・ぽいん
・ふわふわ
・ロボロボ
4.作ったGif画像をワードプレスにアップする
ここでいよいよ作ったGif画像をワードプレスのメディアからアップします。
5.SANGOのショートコードに組み合わせる
今回はわかりやすいように画像名を
「ugokumikakosan1.gif」
「ugokumikakosan2.gif」
と設定しておきました。
そうするとこんな感じで…
うごくミカコさん1
うごくミカコさん2
ブログの中で感情などを伝えるのにも役立ちそうな動く吹き出しアイコン
基本的にブログとはテキスト(文章)メインになるので、
どうしても発信者の伝えたい所や強調したい所が読者に伝わらないことがあります。
文字色を変えたり、フォントサイズを大きくしたり
アンダーラインやボックスなどを使用しても、それでベストではありません。
吹き出しのアイコンが動くことで
・楽しそうな点はより楽しそうに伝えられ
・注意を促したい所も注意喚起を更にすることも可能です。
うごくNGさん
NGや禁止事項なども伝える時にこのような感じで動き出すことで注目を集めることが可能です。
初心者に優しいブログ運営まとめ
ブログ運営って記事を書くだけではなく、
今回の「動く吹き出しアイコン」はただの一例ですが、
どうしたらもっと面白いコンテンツになるのか?
何をしたら今までよりも読まれる可能性が広がるのか?
を考えていかないといけません。
もしかしたらすごく単純な方法やちょっとした工夫で
ものすごく良くなる!なんて言うことも…
ブログを1つの実験室、ラボとして
今までに試して見なかったことを試してみるのは
とても学びやひらめきがあると思います。
というわけでミカコさん、
今回は寄稿をさせていただきありがとうございます!
◯カミジョーとは
ブロガー歴7年
延べ30サイト運営
書いた記事は3500記事を超える
デイリー最高アクセス22万
月間130万アクセスを達成
最近は初心者ブロガー向けのオンラインサロン「ニコまつりサロン」を運営しております。
詳しくは
・カミジョーとはをご参照ください