JIN-ピックアップコンテンツに画像が反映しない

ブログ

JINでピックアップコンテンツにカテゴリーページのアイキャッチ画像を表示させる方法

2018-12-04

本記事では、ワードプレスのテーマ「JIN」でピックアップコンテンツにカテゴリーページを指定した時に、アイキャッチ画像が表示されない問題の対処方法を紹介します。

筆者もこの問題に直面しまして悩みました。

いろいろ確認してわかった解決策をお伝えしますので、該当する人は参考にしてもらえれば幸いです。

[jin-iconbox01]本情報は2018/12/04(JINのVer1.770)現在です。[/jin-iconbox01]

ピックアップコンテンツにカテゴリーページのアイキャッチ画像が表示されない

まず、筆者に起きた事象を紹介しておきます。

以下の画像を見てもらうとわかりやすいと思います。

[jin-img-waku]

JIN-ピックアップコンテンツに画像が反映しない

▲カテゴリーページに設定したアイキャッチ画像が表示されない

[/jin-img-waku]

カテゴリーページに設定したはずのアイキャッチ画像が表示されないのです・・・。

これにはいろいろと問題がありましたので、順番に紹介していきます。

解決方法①:カテゴリー編集ページの設定

そもそもカテゴリーページにきちんとアイキャッチ画像が設定されているのかを確認しましょう。

まずはカテゴリー編集ページを開いてください。

[jin-fusen1-up text="カテゴリーを編集するページ"]

ワードプレス WordPress カテゴリーの編集 ページ

投稿 -> カテゴリー -> 該当のカテゴリーの「編集」

このページを正確に設定しておくことが前提になります。

以下に紹介することがきちんと出来ているかを確認してみてください。

カテゴリー編集ページで大きなアイキャッチ画像を指定する

JIN カテゴリーの編集 アイキャッチ画像設定

▲ここでアイキャッチ画像を設定します。

カテゴリーページにアイキャッチ画像を設定するには、カテゴリー設定ページの「画像を選択」にて画像を選択することで出来ます。

画像を指定してプレビューを見てもアイキャッチ画像が表示されないのではないでしょうか。

実はここで指定するアイキャッチ画像は、画像サイズが1440×810以上でないといけないようです。

有効なサイズは以下のサイズになるようです。

[jin-fusen1-up text="カテゴリーページで使えるアイキャッチ画像のサイズ"]

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

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

実際に1440×810の画像で試してみましたが、アイキャッチ画像がきちんと表示されました。

JIN カテゴリーの編集 アイキャッチ画像設定成功

▲こうなれば成功です!

大きなサイズの画像をアップロードすることになるので、容量が大きくならないように気をつけてください。

ページの読込速度に影響しますよ。

カテゴリー編集ページに本文を入れないといけない

ここまででアイキャッチ画像の指定バッチリです。

この時点でプレビューを見てみてください。

・・・アイキャッチ画像が出ないですよね。

実は、アイキャッチ画像をカテゴリーページに表示させるには本文を入力しないといけないことがわかりました。

JIN カテゴリーの編集 本文設定

▲ここでカテゴリーページの本文を設定

[chat face="5_4.png" name="" align="left" border="gray" bg="none" style="maru"]僕はこれに気付くのに1日かかったよ・・・[/chat]

本文を入れてからプレビューを見てみてください。

アイキャッチ画像が表示されているでしょう。

これでピックアップコンテンツにアイキャッチ画像が表示されていなければ、続きを読んでみてください。

解決方法②:ピックアップコンテンツのデザインを正しく指定する

ここまででカテゴリーページの編集はバッチリです。

でも、ピックアップコンテンツにアイキャッチ画像が表示されない。

JIN-ピックアップコンテンツに画像が反映しない

▲結局これは変わってない・・。

[chat face="5_4.png" name="" align="left" border="gray" bg="none" style="maru"]どんだけ・・[/chat]

これについては、JINのマニュアルサイトに書かれていますが「ピックアップコンテンツのタイプ選択」で解決出来ました。

ピックアップコンテンツのデザインタイプ選択|WordPressテーマ「JIN」の設定マニュアル

JIN カスタマイズ ピックアップコンテンツのタイプ選択

▲ピックアップコンテンツの表示設定箇所

設定は以下です。

カスタマイズ -> トップページの設定 -> ピックアップコンテンツのタイプ選択

[jin-fusen1-up text="ピックアップコンテンツの表示タイプ"]

  • メニュータイプ
  • メニュータイプ(文字なし)
  • 記事タイプ

カテゴリーページのアイキャッチ画像を表示させるには「メニュータイプ」もしくは「メニュータイプ(文字なし)」を選択してください。

[jin-fusen1-up text="各設定の表示内容"]

メニュータイプ JIN ピックアップコンテンツ メニュータイプ
メニュータイプ
(文字なし)
JIN ピックアップコンテンツ メニュータイプ(文字なし)
記事タイプ JIN ピックアップコンテンツ 記事タイプ

「記事タイプ」が選択されていませんでしたか?

筆者の場合は最初「記事タイプ」が選択されていました(多分過去に弄っていた)

「記事タイプ」はカテゴリーページを指定しているとアイキャッチ画像が表示されませんが、記事ページを指定すると表示されます。

2018/12/04(JIN Ver1.770)では記事タイプにカテゴリーページは対応していないようです。

これでピックアップコンテンツにカテゴリーページを指定して、アイキャッチ画像が表示されたのではないでしょうか。

お役に立ってもらえれば幸いです。

-ブログ
-,

© 2020 ブロイキ。