[WordPress]個別ページのアイキャッチ画像を非表示にする

[WordPress]個別ページのアイキャッチ画像を非表示にする

WordPressのアイキャッチ画像を
最近やっと使い始めました。

初めはトップページに画像を
表示させる目的で設定しましたが、
それ以外にも効果がありました。

○アイキャッチ画像の出番
・トップページの記事一覧
・カテゴリの記事一覧
・検索結果の記事一覧
・埋め込み記事(embed)
・人気の記事(Jetpack)
・最近の記事(Newpost Catch)

素晴らしい。

もっと早くやれば良かった。
と思ったのも束の間、
1つ気になる自体が発生。

個別ページの一番上に
画像が表示されてしまう。

上の画像みたいな感じで、
なぜか各記事のページ上段に
アイキャッチ画像がドンと。

こ、こ、これはいらんな。

テーマは「Twenty Seventeen」
利用しております。

目次

WordPressカスタマイズ
〜アイキャッチ画像を非表示に〜

1. 経緯:不要
2. やり方:画像設定
3. まとめ:改善された点



1. 経緯:不要

アイキャッチ画像と記事用画像では
異なるサイズ設定にしているため、
個別ページに表示するとバランスが
崩れてしまいます。(o;ω;o)ウゥ

○アイキャッチ画像
・縦横どちらも200px合わせ

○記事用画像
・縦横どちらか600px合わせ

自分はこんなサイズ感です。

しかもほぼ同じ画像を使用してるので、
一番上に表示されると2つ重複して
並んでしまいナンセンス極まりない。

そこで個別ページのアイキャッチ画像だけ
表示しないよう改善することにしました。

▲ TOPへ戻る

2. やり方:画像設定

テーマ「Twenty Seventeen」では、
「header.php」を編集することで
対応することができました。

<削除コード>
<?php

/*
 * If a regular post or page, and not the front page, show the featured image.
 * Using get_queried_object_id() here since the $post global may not be set before a call to the_post().
 */
if ( ( is_single() || ( is_page() && ! twentyseventeen_is_frontpage() ) ) && has_post_thumbnail( get_queried_object_id() ) ) :
 echo '<div class="single-featured-image-header">';
 echo get_the_post_thumbnail( get_queried_object_id(), 'twentyseventeen-featured-image' );
 echo '</div><!-- .single-featured-image-header -->';
endif;
?>

</header><!– #masthead –>と
<div class=”site-content-contain”>
の間にあるコードを削除すればOK。

自分はなぜかコメントアウトが
できなかったので削除しました。

若干躊躇したけど特に問題なし。

念のためコードのバックアップは
取っておいた方が良いと思います。

万が一、コードが消えてしまったら
「Twenty Seventeen」で検索して、
ダウンロードしてくれば復旧できます。

▲ TOPへ戻る

3. まとめ:改善された点

無事、個別ページ(各記事)の
アイキャッチ画像を非表示に
することに成功しました。

個人的にこの2つの改善に
寄与するかなと思ってます。

・見た目
・表示時間

記事ページの一番上でドンと
ドヤ顔で設置されていた画像が
消えたことでスマートな見た目に。

同じ画像が重複することもなく、
訪問者様への不快感を軽減。

また、記事ページの画像が減ったことで、
表示時間も微小ながら早くなったかと。

以上、

最後まで読んでいただき、
ありがとうございます。

自分用の備忘録ではありますが、
少しでも参考になれば幸いです。

▲ TOPへ戻る