てばお独り言

【WordPress初心者向け】JINで吹き出しがきちんと表示されない場合

WordPressテーマJIN
てばこ
てばこ
私達の会話って吹き出しを使って普通に書いてるけど初心者にはちょっと敷居が高いのよね~
てばお
てばお
はい。てば旅も最初は吹き出しの画像が表示されなかったりするトラブルがあって殺風景なブログでした
てばこ
てばこ
それが今じゃサクサクじゃないの。成長したわね~
てばお
てばお
はい~。ですので今日は、僕が最初の吹き出しの設定で苦労したところをWordpress初心者の皆さん向けに解説します~

 

JINの吹き出しがキチンと表示されない

吹き出しってなあに?

 

とり子
とり子
コケ~

 

と、こんな感じにキャラクターといっしょに表示される会話部分が吹き出しですね。

ブログを読んでいますと、文章ばかりのブログだと疲れてしまいますので、たまにこういった会話が入ると癒やされますね。WordPressではこのような吹き出しを入れることができるんです。

通常ですと吹き出しプラグインの「LIQUID SPEECH BALLOON」を使ったりするのですが(吹き出しプラグインで有名だったSpeech bubbleは配布終了しました)、このLIQUID SPEECH BALLOONはキャラクターの登録が10人までなんですよね。

てば旅は、スタートして2ヶ月で登録キャラクターは10個を超えてしまったのでちょっと足りません。

しかしWordPressテーマのJINは、この吹き出しをプラグイン無しで使えて、さらにキャラクター登録数無制限なんですよね。

 

てばこ
てばこ
これめちゃくちゃ便利なのよ!

 

しかし・・・

吹き出しがちゃんとでてこない

JIN吹き出しエラー

吹き出しの端っこにへんな■がでますね

JIN吹き出しエラー

画像が切れちゃいますね

まずこんな表示になってしまう場合ですが、これは大抵コードのどこか1文字間違ってるなんてことがほとんどです。例えば上の■が出るのは、下のコードの「none」が「non」になってただけで、てばこさんが切れちゃってるのは「left」を「lift」と記述間違いで起こりました。

JIN吹き出しコード

あと、画像の拡張子(この場合はtebakoの後ろの「.jpg」)も記入することが必要です。

 

吹き出しの位置がキャラクターよりずれてしまう

JIN吹き出しエラー

ちょっとだけ吹き出しが下がってます。そんな時はエディタの画面を開きまして・・・

JIN吹き出しエラー 見出しを選ぶタグのところが整形済みになっていないかをチェック。

または吹き出しがずれているのではなくて、キャラクターがずれている場合もあります。その場合は吹き出しの画像サイズを80×80で作ってみてください。

 

画像が表示されない場合

JIN吹き出し 画像が表示されない

こちらの場合は

  1. 記述間違い
  2. 画像のファイル名が長すぎないか
  3. 吹き出しを入れる時はテキストエディタでいれてみる
  4. WordPressとPHPとJINのバージョンが最新かどうか?
  5. 以前テーマを変更したことがある方でしたら、WordPressの管理画面から【設定】→【メディア】→下の方にある【年月ベースのフォルダに整理】にチェックをいれる
  6. Lazy Load系のプラグインを使っていたら止める

とこの辺りを試してみてください。

 

吹き出しの便利な呼び出し方

みなさん吹き出し入力の時はプラグインの「AddQuicktag」を使っている方が多いと思いますが、てば旅では吹き出しのコードをそのまま辞書登録しちゃうことをおすすめしてます。

たとえば「みぎ」って打つと・・

吹き出し便利な使い方
てばお
てばお
僕がでてきます

「せんせい」って打つと・・

JIN 吹き出し 便利な使い方
先生
先生
ハロー!

吹き出しは会話形式でサクサク記述しちゃいたいので、いちいちマウスを触らなくて良いのでとっても便利ですよ!

 

てばこ
てばこ
ただし!MicrosoftIMEは辞書登録できる文字数が短いから、もしできなかったらGoogleのIMEを使えば長めの文字も登録できるわよっ!

JINで吹き出しがきちんと表示されない まとめ

てばこ
てばこ
吹き出しの件もそうだけど、Wordpressって最初はトラブル多いわよね~
てばお
てばお
はい。特にエディターのGutenBerg絡みは凄い多いみたいで、てば旅のJINの記事は沢山の方が検索してくれています
てばこ
てばこ
でもJINってフォーラムの人たちや製作者のひつじさんもすごい丁寧に教えてくれるわよね~
てばお
てばお
そうなんですよね。ひつじさんTwitterとかでも教えてくれますし、すごい労力だと思いますよ
てばこ
てばこ
ほんとひつじさん大変ねぇ。さて、ブログ一段落ついたらお腹空いてきたわ~!今夜はジンギスカンなんていいわね~!食べまくるわよ~~!!
てばお
てばお
(恩を仇で返すとはこういう事なのか・・)
要点まとめ

JINを使い始めたらフォーラムをのぞいてみましょう

こちらの記事もオススメ!