=このブログはJINで作ってます=
JIN

WordPressテーマJINのピックアップでカテゴリー設定可能に!アイキャッチ不具合の解決方法は?

アイキャッチ

WordPressの有料テーマJINのアップデートが2018年9月にありましたが、このアプデで、これまで個別記事しか設定できなかった「ピックアップコンテンツ」に、カテゴリーも設定できるようになったのを、あなたはもうご存知でしたか?

 

すこみみ
すこみみ
は前から出来たらいいなと思っていたからうれしい!

 

2018年9月29日時点で画像がうまく設定できないという状況だったのですが、その原因もJINの運営に問い合わせた結果わかりました。

 

このことも含め、すべてまだマニュアルには出ていない内容なので、読んでぜひお役に立ててくださいね!

この記事でわかること

ピックアップコンテンツとは
ピックアップコンテンツのどこがアップデートで変わったのか
ピックアップコンテンツにカテゴリーを設定する方法
カテゴリーのアイキャッチ【一部不具合解決】とディスクリプションについて
ピックアップにカテゴリー設定後の表示速度について

 

 

WordPressテーマJINのピックアップコンテンツって?

ピックアップコンテンツ

 

このブログのトップページの上部にあるアイキャッチ+キャッチフレーズが並んでいるところ、これがピックアップコンテンツです。

 

ぜひ読んでもらいたいイチオシ記事に気づいてもらいやすい機能なので、私も愛用しています。

 

JINの公式マニュアルには、現在は個別記事をピックアップコンテンツに設定する方法が書かれています。

 

ピックアップはJINのアップデートでどう変わったの?

JINは平成30年9月、Ver1.70にアップデートされました。

 

すこみみ
すこみみ
いろんな変更・改良がされたのよ。

 

ピックアップコンテンツの変更について、あまり目立つ周知はされていませんでしたが、公式サイトのアップデート情報の記事中、アップデート内容に書かれていました。

③ピックアップにカテゴリーを設定できるように修正JIN公式サイト

 

つまり、これまで個別記事しか載せられなかったのが、カテゴリーも載せられるようになったということです。

 

実は以前、私はカテゴリーも設定できると思っていたのにうまくできずに、こんな間抜けなツイートをしていました。

 

すこみみ
すこみみ
この時点ではカテゴリーでは設定できなかったのにね…

 

しかし今回は違います!ちゃんとカテゴリーも設定できるようになったんです。


そして、それに合わせて?、カテゴリー用のアイキャッチ、そしてディスクリプションも設定できるようになったようです。

Twitterでやりとりしていると、私以外にもピックアップコンテンツにカテゴリーも設定できるといいな、と思ってた方はいたので、これは待望の変更といえますよね!

 

はじめにカテゴリーのアイキャッチを設定【一部解決】

この設定はまだ完全に解決していません。他の方からも同様の報告をいただいているので、そのことも含めて記載しています。

 

カテゴリーをピックアップコンテンツに設定するなら、その前に、カテゴリーにアイキャッチを設定する必要があります。でないと、そのカテゴリーのピックアップコンテンツが「No Image」の状態で表示されてしまうからです。

 

カテゴリー編集画面に行く

カテゴリーメニュー

画像のとおり、ダッシュボードのメニューから「投稿」→「カテゴリー」と進んで選択します。

 

カテゴリーのアイキャッチ画像を選ぶ【解決前】

2018年9月29日現在、公式運営からお返事をいただきましたが、課題は残っていると感じます。そこで、問題を共有する意味でこれもこのまま掲載します。

 

カテゴリー編集の画面に行ったら、スクロールして下の方へ移動します。

カテゴリー編集1

 

途中「ページタイトル(検索エンジン用)」という項目が出てきます。詳しい説明は出ていませんが、検索エンジンで検索されるためのタイトルだと思います。そこでこのように入力します(正確なことがわかれば追記します)。

ページタイトル入力

 

 

さらに下に移動すると「カテゴリーのアイキャッチ画像」という項目が出てくるので、「画像を選択」をクリックして、アイキャッチ画像として使いたい画像をメディアから選びます。

 

カテゴリー編集7

ここでは、選ぶ画像のサイズに気をつけましょう。ピックアップコンテンツについてのマニュアルには「画像サイズは640px × 360px以上のもの」でなければとありました。小さいものを選ぶと、↓の画像のようにアイキャッチが表示されることがないのを確認済みです。ただ、カテゴリーの画像サイズについては情報が更新されたので、以下のようなエラーにある方は、次の大見出しの項をご覧ください。

 

正しいサイズの画像を選べば、こんな風にアイキャッチが編集画面で表示されます。そうしたら、一番下までいって「更新」ボタンをクリックすれば設定されるはずで…

 

はずです…が!あれ?

 

2018年9月29日現在、「更新」をクリックすると、元に戻ってしまう、つまり、設定したアイキャッチが編集画面から消えるのです。

カテゴリー編集画面からアイキャッチが消えた

 

その結果、この編集画面で「更新」ボタンをクリックしても、画像が設定できないままなので、この後カテゴリーでピックアップコンテンツを設定しても、このように「No Image」になってしまいます。

ピックアップコンテンツ(画像表示されない)

上記のエラーの解決法を次に記載していますので確認してください!

 

【最新】JIN運営アイキャッチについての返答(9/29)

この記事を公開したのと同日に、運営から上記のアイキャッチのエラーについて、返答がありました。

当運営で確認いたしましたのは 1440px × 810px 1500px × 844px 2560px × 1440px 上記で精査いたしました。 これ以上の大きさであれば問題なく設定ができるかと思います。JIN運営からの問い合わせへの返答

 

カテゴリーのアイキャッチが表示されるサイズはこれ!

ということで、マニュアルに書いてあるサイズではなく、もっと大きなサイズでないと表示できないことがわかったようです。つまり、

【2018.9.29最新情報】
カテゴリーのアイキャッチが反映されるためには、画像のサイズが

  • 1440px × 810px
  • 1500px × 844px
  • 2560px × 1440px

でないといけないらしいです。

 

このサイズでアイキャッチが表示されるかテスト

そこでこのように早速やってみると…

カテゴリー設定画面

なんと!更新ボタンをクリック後も、ちゃんとアイキャッチが残っています!

 

これで試してみると、↓の項目のとおりにカテゴリーでピックアップ設定後のトップページはこうなります。

 

解決後のトップページ

 

きゃーっ、できました。アイキャッチがちゃんと表示されました!

 

でも、ピックアップの時だけこのサイズにしないといけないのは作業効率良くない…なんとかならないのでしょうか。アプデに期待ですか?

 

すこみみ
すこみみ
ということで、動作は確認したうえで、私はカテゴリーをピックアップにするのはやめました。

 

なお、この変更に伴って表示速度がどう変わるか、記事の最後にテスト結果を簡単にまとめてあります。

 

カテゴリーのディスクリプションを設定する

アイキャッチ画像の設定部分のすぐ下に、カテゴリーのディスクリプションを設定できる欄があります。

 

これについてもまだ説明がなされていませんが、検索エンジンで、このカテゴリーの説明として表示されるのではないかと思います。そこでこのように入力します。

 

ディスクリプション設定2

 

アイキャッチ設定からディスクリプションまでの流れを画像で示すとこのようになります。ディスクリプションまで入れたら「更新」ボタンをクリックしましょう(ただし、アイキャッチはまだ反映されません)。

 

カテゴリー編集6

 

もちろん、アイキャッチ設定とディスクリプション、そのどちらか一方だけでも設定は可能です。

 

ピックアップコンテンツにカテゴリーを設定する方法

 

さあ、カテゴリーの設定が完了したら、これを使ってピックアップコンテンツを作りましょう!

 

すこみみ
すこみみ
ここまでが長かったけど、ちゃんとカテゴリー設定してからの方が無駄がないわ。

 

実はこの記事を書いている2018年9月29日現在、JINマニュアルにこの件に関する具体的記述はまだありません。

ただ、上の方でご紹介した個別記事での設定方法と大きな違いはないようです。

 

ピックアップコンテンツの作り方

まずはワードプレス管理画面のメニュー設定で、ピックアップコンテンツのメニューを作っておく必要があります。

 

まずピックアップコンテンツのメニューを作る

ピックアップコンテンツは、ワードプレスの管理画面にしてから、「外観」→「メニュー」と進み、メニューの管理画面へといきます。

 

管理画面②

 

メニューの設定画面になったら、ここでピックアップコンテンツのメニュー設定をします。

管理画面③

 

私はこれまでもピックアップコンテンツを設定していたので、すでにここに赤丸で囲ったようにピックアップ用のメニューができています。

 

すこみみ
すこみみ
まだこれから作る、という方は、公式マニュアルを見て設定してみてね。

 

ピックアップにカテゴリーを設定する

ピックアップコンテンツをメニューで作成したら、ここにカテゴリーを選んで加えます。

メニュー

左の方にある「メニューを編集」のタブの中にある「カテゴリー」から選びます。

「すべて表示」を選べば、すべてのカテゴリーが表示されるので、そこから設定したいカテゴリーを選択してチェックを入れたら「メニューに追加」をクリック。

 

すると図のように、画面の「メニュー構造」の中に、選んだカテゴリーが追加されます。

メニュー

 

ピックアップにコンテンツを設定するだけなら、まずはこれでOKです。

 

上でお話しした通り、今はアイキャッチがうまく設定できないので、画面上はこのように表示されます。

アイキャッチについても、サイズを大きくすれば、上の方で書いたようにちゃんと表示されます。もう一度、運営に教わったサイズを書いておきますね。

 

【2018.9.29最新情報】
カテゴリーのアイキャッチが反映されるためには、画像のサイズが

  • 1440px × 810px
  • 1500px × 844px
  • 2560px × 1440px

でないといけないらしいです。

 

解決後のトップページ

 

アイキャッチはありませんが、ここをクリックすると、きちんと狙った通りのカテゴリーページに飛ぶはずです。そこまでできていれば、この作業はとりあえず完了。

 

ピックアップにカテゴリー設定後の表示速度に変化は?

一晩寝かせて、やっぱりブログ運営カテゴリーを表示させることにしました。今、トップページはこんな感じになっていますよね。

トップページキャプチャ

 

圧縮してあるのでとくに変化はないと思いますが、表示速度をチェックすると、

  • PageSpeed Insights
    あまり変化なし(というか、このブログは力量不足で速度表示されないのです。最適化については変化ありませんでした)。
  • testmysite
    3・4秒くらい遅くなった…かも?そもそもJIN使用のサイトは遅めなのとその時によって少し違うのでなんともいえないけど…
すこみみ
すこみみ
こ、これはちょっと…やっぱり元に戻そうかな

 

見た目を良くしてわかりやすくしても、そこに行きつく前に離脱されたら意味ない!

ちょっとショックですね…ということで、やはり元に戻すかもしれません。

 

JIN カテゴリーのピックアップ設定方法 まとめ

ピックアップをカテゴリーで設定する方法

  1. 先にカテゴリーの編集をしておきましょう
  2. アイキャッチ画像はサイズに気をつけましょう。1440px × 810px以上は大丈夫。
  3. ただし、トップの表示速度が落ちる可能性があります。
  4. カテゴリーのディスクリプションも設定できます
  5. ピックアップコンテンツを設定する方法は、基本的には個別ページで設定するときと同じです

そうこうしている間に公式マニュアルが更新されるかもしれないですが、それまでだけでもお役に立てたらうれしいです。

 

jinアイキャッチ

POSTED COMMENT

  1. ギャラクシー より:

    カテゴリーにアイキャッチ画像が挿入できなくて困っていました・・・。この記事を見て、画像サイズを1440×810に変更したら無事解決しました。感謝いたします。

    • scomimi より:

      ギャラクシー様

      コメントありがとうございました。
      わたし自身が困ってしまったことは、その解決方法までできる限り共有したいと思っているので
      お役に立ててとてもうれしいです!

  2. […] WordPressテーマJINのピックアップでカテゴリー設定可能に!アイキャッチ不具合の解決方法は?|理学療法士・作業療法士・言語聴覚士の卵の臨床実習を応援するブログ […]

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です