wordpress-logo

[WordPress] TwentyFifteenのアイキャッチ表示を修正した

このブログは、(このエントリーを書いている時点では)WordPressのテーマ「TwentyFifteen」を利用しています。

ブログを立ち上げた際に、元のテーマをそのまま導入したところ、アイキャッチがクロップ(切り抜き)された状態で表示されてしまいました。

どうやら、幅825px・高さ510pxのサムネイルで、ピッタリ表示できるように作られているため、縦横比やサイズによっては残念なコトになるようです。

「設定>メディア」のページにある「サムネイルを実寸法にトリミングする」という項目があったので、試しにチェックを外してみたのですが表示は変わらず。

twentyfifteen_setup関数の中にあったset_post_thumbnail_size関数を修正しても変わらず。

仕方なく、応急対応で画像全体が表示されるようしたので、今回はその内容を(忘れないように)書いておきます。

テーマは直接修正せず、別のテーマとして用意してから修正を行っています。
その辺りについては、下記のように多くのサイトで方法やメリットなどが解説されていますので、そちらを参考にしてください。

テーマを自作したい人必見!WordPressの基本的な仕組み

WordPress Customize NOTE > WordPress オリジナルテーマの作り方

修正方法

TwentyFifteenでは画像を表示をする際に、WordPressで用意されているthe_post_thumbnail関数を直接実行せずに、template-tags.phpの中にあるtwentyfifteen_post_thumbnail関数を経由しています。

そこで、twentyfifteen_post_thumbnailの中でthe_post_thumbnailを実行している箇所を修正しました。

TwentyFifteenではfunction_exists関数で定義の有無を確認してから定義をしているので、自分で別テーマを用意していれば、functions.php内に同名の関数を定義することで、関数の上書きをすることが出来ます。

今回は元のtwentyfifteen_post_thumbnail関数をゴソッとfunctions.phpへコピペして、2行修正を行いました。

(1) エントリーのページ
修正前 the_post_thumbnail();
修正後 the_post_thumbnail(‘medium’);

(2) 一覧のページ
修正前 the_post_thumbnail( ‘post-thumbnail’, array( ‘alt’ => get_the_title() ) );
修正後 the_post_thumbnail( ‘medium’, array( ‘alt’ => get_the_title() ) );

結局、サムネイルサイズにしていると切られてしまうので、他のサイズに逃げただけです。
そのため、上記ではmediumにしていますが、largeでもfullでも構わないです。
画像は大きくなりますが。

終わりに

一応、上記の対応で画像が切られることなく表示されるようになります。

あまりデザインがかっちり決まっていて、エントリーを制作するときに気にする必要があるのは、ワタシ的には不便なので、そのうち別のテーマに変えてしまうかもしれないです。

[WordPress] TwentyFifteenのアイキャッチ表示を修正した」への1件のフィードバック

  1. ピンバック: Inherit | ギンイロネット

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です