ワードプレスでアイキャッチ画像を設定し、個別投稿ページを表示すると、通常は下記のようにヘッダー画像と個別記事の間にアイキャッチ画像が配置されてしまいます。
なんかとっても見栄えがワルイと感じるのは私だけでしょうか?
これを、記事の中、タイトルの下に配置させる方法を説明します。
テーマは「Twenty Seventeen」です。
phpを直接修正しますので、バックアップを取っておくか、子テーマを作成し、それに対して修正を行ってください。
phpの修正は「外観>テーマファイルエディタ」で行えます。
★テーマ:「Twenty Seventeen」
★修正PHP:「header.php」「template-parts/post/content.php」
上記のPHPファイルを以下のように修正してください。
【header.php】
・50~54行目にあるアイキャッチ画像表示部分を削除、もしくは、コメントアウトする。
(修正前)
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;
(修正後)コメントアウトする
/*
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;
*/
【content.php】
・44行目にあるアイキャッチ画像表示条件文の「 && ! is_single() 」を削除する。
(修正前)太字部分を削除する
<?php if ( '' !== get_the_post_thumbnail() && ! is_single() ) : ?>
(修正後)
<?php if ( '' !== get_the_post_thumbnail() ) : ?>
とっても簡単ですね!
修正は自己責任でお願いします。