[WordPress]個別ページのアイキャッチ画像を非表示にする
WordPressのアイキャッチ画像を
最近やっと使い始めました。
初めはトップページに画像を
表示させる目的で設定しましたが、
それ以外にも効果がありました。
○アイキャッチ画像の出番
・トップページの記事一覧
・カテゴリの記事一覧
・検索結果の記事一覧
・埋め込み記事(embed)
・人気の記事(Jetpack)
・最近の記事(Newpost Catch)
素晴らしい。
もっと早くやれば良かった。
と思ったのも束の間、
1つ気になる自体が発生。
個別ページの一番上に
画像が表示されてしまう。
上の画像みたいな感じで、
なぜか各記事のページ上段に
アイキャッチ画像がドンと。
こ、こ、これはいらんな。
テーマは「Twenty Seventeen」を
利用しております。
目次
WordPressカスタマイズ
〜アイキャッチ画像を非表示に〜
1. 経緯:不要
2. やり方:画像設定
3. まとめ:改善された点
1. 経緯:不要
アイキャッチ画像と記事用画像では
異なるサイズ設定にしているため、
個別ページに表示するとバランスが
崩れてしまいます。(o;ω;o)ウゥ
○アイキャッチ画像
・縦横どちらも200px合わせ
○記事用画像
・縦横どちらか600px合わせ
自分はこんなサイズ感です。
しかもほぼ同じ画像を使用してるので、
一番上に表示されると2つ重複して
並んでしまいナンセンス極まりない。
そこで個別ページのアイキャッチ画像だけ
表示しないよう改善することにしました。
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」で検索して、
ダウンロードしてくれば復旧できます。
3. まとめ:改善された点
無事、個別ページ(各記事)の
アイキャッチ画像を非表示に
することに成功しました。

個人的にこの2つの改善に
寄与するかなと思ってます。
・見た目
・表示時間
記事ページの一番上でドンと
ドヤ顔で設置されていた画像が
消えたことでスマートな見た目に。
同じ画像が重複することもなく、
訪問者様への不快感を軽減。
また、記事ページの画像が減ったことで、
表示時間も微小ながら早くなったかと。
以上、
最後まで読んでいただき、
ありがとうございます。
自分用の備忘録ではありますが、
少しでも参考になれば幸いです。