ワードプレスで有料テーマに変更すると書いた記事の吹き出しが壊れて面倒です。便利なプラグインAddQuicktagでよく使う吹き出しの設定を説明します。
ワードプレスで有料テーマ【THE THOR】に変更すると過去の記事の吹き出しはこんな感じ
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/539e3ce10ae712bb8e5c0ff6c400d8f0.jpg)
これ本当は吹き出しの画像が小さいのに元の大きさで、更に吹き出しの内容は普通の文章になります。まぁひどい壊れ方ではないですがやはり直しましょう。
プラグイン”AddQuicktag”をインストールして有効化
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/5bf1b4a17ceabe4201c071d866f64e77.jpg)
プラグイン>新規追加をクリック
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/0b228d1f044b5b4d522308176aec93aa-1024x207.jpg)
キーワードにAddQuicktagをコピペまたは入力。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/9f7f76dfb595d2a13fc4ec3fa4443cc6.jpg)
今すぐインストール>有効化をクリック
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/442fbb924de400199c2d8b76012f62bd.jpg)
すると設定の中にAddQuicktagがでるようになります。このAddQuicktagをクリック
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/d124622b2ac68068c5f50975bab2ea3e-1024x192.jpg)
このような設定画面になります。ここで書き込む内容が少し面倒なので一旦ここからぬけます。
AddQuicktagの内容をつくるために一旦投稿>新規追加で仮の記事をつくります。
投稿>新規追加をクリック
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/d1f7053515398bbc692d649caf0b321c.jpg)
この仮記事は保存しませんのでタイトルななんでもいいです。ここでは”てきとう”にしました。
一段下がった記事内容から、プリセットパーツ>吹き出し>
を選びます。ここで左か右の吹き出しを選びます。私の場合は左画像ボーダースタイルを選びました。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/abb0368f33c8efa3c4ac50b50e625908.jpg)
標準の吹き出しには左の場合は上のネコが設定されてます。一旦このネコの写真をクリックします。上の赤矢印あたりにカーソルがくると思います。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/a7b4184ea435015e25a575db3479114f.jpg)
この状態で挿入>メディアの追加をクリックします。
メディアを追加で画像を選びます。まれにバグなのか吹き出し画像が変に小さくなってしまう場合があります。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/d44bf9fc1b0dde529f4a6e49dcfd332e.jpg)
その時はメディアを追加画面の右側の添付ファイルの詳細または表示設定を変更してみます。ここではこの投稿記事は仮設定なので何も問題ありません。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/071a00ddcf530b5bdf0ea48721d428f6-1.jpg)
代替えテキストやキャプション、説明は空白にします。ここでは仮置きなので空白でいいです。特に私の設定の場合は”キャプション”に文字が入っているとこのような小さい画像になってしまいました。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/40283ed305c9d0be9828569aa380962a.jpg)
なかなかうまくいかない場合はこちらの表示設定も変更してみましょう。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/e5fe6334c6013bc1ba2274fabb0fe4a0.jpg)
このように吹き出し画像が設定できました。
次にこのアイコン下に名前をつけます。上の写真で”undefined”の文字をクリックして直接ここに書き込みます。
ここまできたら、テキストエディタの表示に変更します。
画面右上の歯車アイコンの隣のボタンをクリックします。
すると、”コードエディタ”がでてきますのでこちらをクリック。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/7300e2d049e78e4cf61268135601a8e8.jpg)
するとテキストエディタ画面にかわります。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/e63e0d6e616e51ea513e2f4912a52e29.jpg)
赤矢印の赤枠部分をコピーしてください。範囲の目安は<div class=”balloon”>から開始して、最後のほうは>コメント</div></div>までの範囲です。
コピーしたらまずはこの投稿を下書き保存をクリックしておきましょう。
画面右上です。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/b1ca58a95757d9749774a942423c6295.jpg)
再びAddQuicktagの設定画面にもどります
再び、設定>AddQuicktagをクリックします。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/442fbb924de400199c2d8b76012f62bd.jpg)
開始タグをクリックして、この場所に先ほどコピーしたものペーストします。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/6f8d291a38ea4770da105e8c62195b8a.jpg)
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/be8496aa0394b1f14df659433869895e.jpg)
ペーストしましたら、このペーストした一番最後の”</div>”を切り取ります、そして下にあります終了タグにペーストします。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/f8d5d9ac69b29ef4b51906ff6ac2b276.jpg)
赤矢印の下アイコンをクリックして一番下までもっていきます。そして一番最後の”</div>”を切り取ります。(コピーではなく切り取りです)
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/b67aefc9d943bb015f4d02995f6ebac4.jpg)
下にある”終了タグ”にペーストします。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/fb434639495462fad463c2a70f786a27-1024x265.jpg)
ここまでくれば、あとは簡単です。
|
最後にしっかり設定できているか確認
投稿画面で先ほどの吹き出し設定ができているかを確認します。下書き保存した先ほどの投稿記事に戻ります。(確認だけなのでどこでも良いです。)
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/571d35667b4c46c0816585edf249d84d.jpg)
Quicktagsのコマンドがありますのでこれをクリック。設定されているタグが表示されます。
![](https://yasuayutthaya.com/wp-content/uploads/2020/06/69804e1939042ef0051058e98c7d1676.jpg)
できました!あとはコメントの中を書き込む作業です。