テーマとして選んだ「TwentyFifteen」のカスタマイズネタです。記事を投稿する際に「アイキャッチ画像」が選択できます。既定値では、記事の表示サイズで画像が表示されてしまうので、このサイズを変更してみました。
アイキャッチ画像とは、記事内容を一目で表現するような画像を記事の上部や一覧画面に表示する機能です。
「TwentyFifteen」の場合、記事上部に表示幅で画像が表示されます。
これでは、大きすぎるのでサイズ変更をしてみます。変更する場所は、２か所で「function.php」と「content.php」を編集します。
管理画面の「外観｜テーマの編集」画面で右側のテンプレートから「テーマのための関数（function.php）」を選びます。
function twentyfifteen_setup() 関数内の次のコードを変更します。
add_theme_support( 'post-thumbnails' ); /* set_post_thumbnail_size( 825, 510, true ); */ set_post_thumbnail_size( 420, 420, false );
コメントアウトされている部分は既定値です。
「ファイルを更新」ボタンをクリックして、更新を行います。
同様に、content.php 内の次の部分を編集します。
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <div style="height:48px;"></div> <?php // Post thumbnail. twentyfifteen_post_thumbnail(); ?> <header class="entry-header">
<?php … ?> の部分が実際にアイキャッチ画像が表示される部分で、私の場合最上部からイメージが表示されると都合が悪いので、divタグを使ってスペースを確保しています。Wordpressのthe_post_thumbnail関数でスタイルシートを適用できるのですがTwentyFifteenテーマの場合、その処理がtwentyfifteen_post_thumbnail関数として表示切替処理が追加されているので、単純にスペーサーを追加する形にしました。
こんな感じに表示が変更されました。
