greenの日記

ブログ運営/投資/株主優待/REIT・インフラファンド/アドセンス の話し

【ブログ運営】憧れの吹き出しのあるブログ!

こんにちは、greenです。ブログを書くときに、会話形式で書きたい時がありますよね。私も会話形式で書いていますよ、こんな感じです。

👶 グーグルさん会話形式でお話しよう ばぶー
Ⓖ いいよ!
😅読者の方がイメージしている会話形式と違うんじゃないかな?
👶 これが現実、事実なので仕方ない ばぶー、確かにしょぼいな!

この絵文字を使った会話形式を下のイメージように、吹き抜けのある家のように、豪華にしたいと思います!

f:id:greenupf:20190217190028j:plain

😅えっ、なんかおかしくない⤴
👶 確かに画像が長すぎるぞ!
😅長いのは吹き抜け感を出したかったので、いやそうじゃなくて⤴
👶 分かったぞ、吹き抜けで本は読まんやろ!
😅ブーー。。。

今回の記事では、絵文字の会話形式を卒業するため、吹き抜けではなく、吹き出しの会話形式にしていきます。なるほど、そこが違うのか🤔👈まじめに考えるな!

吹き抜け。。。ではなく吹き出しの会話形式に興味のある人の参考になればと思います。👈しつこい!

記事の内容は、完成例吹き出し形式にするためまとめの順で書いていきます。

完成例

こちらが完成例になります。私のブログの会話形式で良く出てくる人達です。簡単に自己紹介します。

こんにちは、くーるBabyです。鋭い突っ込みが得意です。好きなものはミルク ばぶー。

こんにちは、greenです。顔の輪郭はひみつです。

こんにちは、ぐーぐるです。なんでも聞いてくださいね。

こんにちは、あどせんすです。放置プレイが好きなわけではなく、説明が雑なのと対応に時間がかかるだけです。

これからもよろしくお願いします。下の3つはペイントで作りました。

吹き出し形式にするため

吹き出し形式にするための作業内容を順番に書いていきます。

  1. 登場人物を洗い出します。
  2. 1で洗い出した登場人物の画像を作成します。
  3. 2で作成したファイルをはてなフォトライフに保存します。
  4. 3で保存したファイルのURLを取得します。
  5. CSSを修正します。
  6. 吹き出しの設定完了です。
  7. 記事作成時に吹き出しを入れます。

詳細については、👇こちらでご確認ください。いつかはブックマーク3桁が欲しいですね!

www.notitle-weblog.com

まとめ

もう、まとめですが、憧れの吹き出しのある会話形式に変更することが出来ました。
参考になる分かりやすい記事もあり、意外と簡単に対応できたので、もっと早くすべきだったと思います。吹き抜けが気になる人は、お早めに対応をお勧めします。

実は吹き出し以外にも、次の4つを試しましたので、参考に書いておきます。

  1. 目次のデザイン変更
    →こちらも設定は簡単で、記事が見やすくなるので、お勧めです。
  2. 問合せフォームの設定
    →私は特に問合せもないのですが、設定しました。問合せが来る人は急いで対応を!
  3. サイドバーのTwiterフォロワー数の表示

    →特にサイドバーの表示だと表示に時間がかかると感じたため、一旦設定しましたが、やめました。
  4. 記事下の広告種類を変更
    →記事下の広告がしつこくなり過ぎたので変更をやめました。ブログ赤字運営なので、必死な感じが出すぎました😅。

変更内容によっては、過去の記事修正が必要な内容もありますので、可能な限り早めに変更した方が良かったと感じています。
皆さんも憧れの吹き抜けのあるブログにしてみては如何でしょうか。それでは、green不動産でした。
最後まで、読んでいただきありがとうございます。🙇