2018.04.30スポンサーリンクこんにちは、桃太郎です。この記事を読むとこんな吹き出しが使えるようになります。桃太郎どやっ桃太郎のアイコンを変えました!前は可愛い感じだったんですが、今回はかっこよく描いてみました。アイコンを変えたのは、吹き出しを使いたいな~と思ってで、アイコンを描くついでに表情別で何パターンか作ってみました。吹き出しくらい簡単に設置出来るだろうとあまく見てたら、なんとまぁ難しいこと。簡単にプラグインで設置できるってんだから、早速設置してみたらアイコンが小さいこと小さいこと。表情を分けて書いたのに全く表情が見えない。パソコンから見たアイコンのサイズ。Bubble使用これはイカンと、このプラグインを使用してなんとかアイコンを大きくしたかったんですが、出来ませんでした。今回はプラグインなしで吹き出しを設置でき、さらにアイコンのサイズ変更も出来る記事を発見したので、ご紹介させていただきます。WordPressで会話風ふきだしを表示させるCSSカスタマイズこちらを参考にさせていただきました。(というかコピペ)この記事ではコードの全文を引用しないので、この吹き出しを使用する際は上記のサイト様からお借り下さい。この吹き出しの特徴アイコンサイズを自分で変えられるアイコンサイズは、紹介されてる記事では60pxになっています。大きいほうがいい方はこちらを変更してください。#333333;font-size:70%;line-height:1.5;max-width:60px;}(一部抜粋)画像は正方形がよさげ私のアイコンは、綺麗な正方形じゃないので、少しだけ縦長くなってしまっていますw桃太郎ちょっと縦長(照れアイコンが左固定これだけが残念です(・・;)まぁ、ごちゃごちゃ記述が増えまくってしまうくらいなら左のみでもいいのかもしれません。※右アイコン吹き出しも作って下さいましたヽ(^◇^*)/WordPressで会話風ふきだしを表示させるCSSカスタマイズ右バージョンを使用する際は、左は自分のアイコンを登録、右は別キャラを登録にすると便利です。私の表情アイコンは8つあるのですが、ひとつひとつfunctions.phpに登録しました(^▽^)逆に、アイコンを全て登録してあるからこそ、実際にHTMLを打ち込む時の記述が少なくてとても便利になってます。HTMLの記述が簡単こちらの吹き出しだと、[kaiwa1]テキスト[/kaiwa1]のみで吹き出しが表示されます。最初の設定が面倒なだけで、それ以降はすこぶる楽です。わたしはAddQuicktagにコードをぶちこんで、ボタンひとつで使えるようにしているので、本当に楽ですw※ちょっと注意するところ一応、引用元の記事でも書かれてあるのですが、見落としてしまいそうだったので、こちらに記載しておきます。‘kaiwasc1Func’);複数のアイコンを登録するときは、この赤い部分の数字の数字も一緒に変更してくださいね。実際に使うとこんな感じアイコンの大きさは120pxにしています。スマホで見たときにアイコンがでかすぎたので、80pxにしました。パソコンだと少し表情がわかりにくいのですが、スマホ優先にします。名前もアイコンも男っぽいですが、女です。好奇心旺盛で、やりたいと思ったことに色々手を出したりするので、このブログも色々なジャンルを書いています。勝手ではございますが、こちらの記事を紹介させていただきました!アイコン右バージョンも作ってみましたので、参考にしていただければ幸いです。コメントをキャンセルメールアドレスが公開されることはありません。事務の仕事って大変?事務に転職する前に知りたい事務のアレコレ初めていくなら見てほしい!八幡東区のシーサードスパ温泉情報。プロフィール桃太郎こじらせ女子。色々なことに興味を持ち、手を出すのでさまざまなジャンルに詳しくなる。それを生かして、得た知識をブログで公開中。詳しいプロフィールを見るおすすめ記事セルカレンズでケラレが出る!解決法を写真を使って解説します。おすすめの自撮り棒を紹介。買うなら絶対有線タイプ!その理由は?初めて杉乃井ホテルに宿泊する人が行く前に確認しておきたい事。viewお出掛け初めて杉乃井ホテルに宿泊する人が行く前に確認しておきたい事。viewカメラセルカレンズでケラレが出る!解決法を写真を使って解説します。きび団子よりもみたらし。