WordPressサムネイルの画像サイズをPHPで修正する

PHPを書き換える

ワードプレスでPHPに手を加えなければならない場面は多くあります。

今回はサムネイル画像サイズがあわず、loop.phpをカスタマイズして修正した内容です。

WordPress、サムネイルの画像サイズ、再読込でリサイズ表示する件。

サムネイルの画像サイズでどういう問題点がおこるのか?

・カテゴリー別の表示で、サムネイル画像の縦横比率がおかしい画像がいくつかある。

全部ではなかったですが、カテゴリー別の投稿記事を表示した画面で、記事のサムネイル画像の

縦横比率があってなくて、画像がゆがんで見えてしまっていた画像が数枚ありました。

▶︎ 【解決方法】

◎ そのウェブ表示からF12で、ソース表示から、どのスクリプトの影響を受けているのかを確認する。

今回はワードプレスの

という関数の影響とわかった。この関数には、

という画像サイズが指定できる。この部分はソースから loop.phpの記述によるとわかった。

◎ loop.phpを書き換える。

下のloop.php一部コードの一番下の部分

<?php the_post_thumbnail(”); ?>を、

上記のように、mediumを入れて更新する。

このmediumサイズとは、設定>メディア設定>中サイズ(デェフォルトで300×300)をひっぱってくる。

この場合300×300はちょっと小さいので、500×500にメディア設定を変更する。しかし、

このメディア設定は、投稿時の画像設定サイズを採用してしまうので、投稿後にサイズ変更が活きない。

 

◎ 再読込でリサイズしてくれるプラグインを探したところ、Regenerate Thumbnailsを見つけた。

早速プラグインから新規追加→有効化した後、loop.phpに「medium」、メディア設定に「500×500」

を保存して、ツール>Regenerate Thumbnails>Regenerate all Thumnail という英語で書かれた

ボタンをクリックした。

すると再読込が開始され、インジケーターが○○%まで進んでいるか表示される。

100%終わった状態で、カテゴリー別のサムネイル画像サイズを確認したら、ちゃんと

指定の500×500で、きれいにリサイズ表示されていた。すごい!

上記3つの方法で、サムネイルが表示したい大きさに無事、表示されました。

ピックアップ記事

  1. 個人と大企業が互角の舞台はWebだけ
    ・ 個人と大企業が互角の舞台はWebだけ ・ 齋藤天津子のビジョン ・ 齋藤天津子…
  2. ・ UXデザインって何ですか? ・ なぜUXデザイナーが注目されているのですか? …
  3. ・ 大事な履歴書用写真なのに、その辺にある適当な写真を使ってませんか? ・ 履歴書用写…
PAGE TOP