ワードプレスで会話風吹き出しをCSSとHTMLで作ってみた！｜おさるの空飛ぶリンゴの見つけ方！

CSSとHTMLで会話風吹き出しを作ってみました！

さるとりんご

おはよう　

息子

おはよう

こんな風に、投稿画面で吹き出し画像を使っておられるサイトを見て、
わたしもやりたい！！と思い色々サイトを検索させて頂きました。

以下のサイトのCSSとHTMLをそのままコピペさせて頂きました。
なんとか、会話風吹き出しが出来ました！！
ありがとうございます。

[blogcard url=”https://moriawase.net/kaiwa-text”]

WordPressの吹き出しプラグインでSpeech Bubbleというプラグインがあるみたいなのですが、2018年4月現在3年間更新されていなかったり、不具合がでたりと、どうやらあまりお勧めではないみたいです。

色々これから上手に使っていけたらな、と思います。
ただ、ライン風の背景にしたい！と思うのがなかなかできません。ちょっとまた色々検索して調べてみます！

※上記できました。　<div class=”line_back”>　</div>
で囲むとラインの青色背景が出来ました！！

（※simplicityのテーマのみ）

記事を書く時、会話のHTMLをいちいちテキストに保存していたものをコピーして、記事内に張り付けていたのですが、それが面倒くさい。

AddQuicktagというプラグインをインストールして、会話風HTMLをAddQuicktagに登録すると、簡単にボタンを押すだけで、記事内に挿入することができます。これは便利で時間短縮になります！

下記のサイト様にAddQuicktagの使い方が詳しく載っていましたので是非ご参考になさって下さい。

[blogcard url=”https://naifix.com/addquicktag/”]

ここまでお読み頂きありがとうございました。