WordPress アイキャッチ画像サイズ カスタマイズまとめ



WordPressのアイキャッチ画像関連でよく使うカスタマイズのまとめです。自分用のメモとして。

アイキャッチを有効にする

アイキャッチのサイズを指定する

$width 画像の横サイズ
$height 画像の縦サイズ
$crop トリミングをするかどうか(デフォルト: false )

false 縦横サイズの長い方でリサイズ
true 画像の中心から指定サイズにトリミング

アイキャッチ画像のサイズを追加する

アイキャッチ画像の基本サイズは、WordPress管理画面の設定>メディアで設定可能。

各サイズの表示方法

  • サムネイル thumbnail
  • 中サイズ   medium
  • 大サイズ   large

上記サイズ以外にもサイズを追加したい場合
add_image_size() で指定する

  • $name 画像サイズの名前
  • $width 画像の横サイズ
  • $height 画像の縦サイズ
  • $crop トリミングするかどうか(アイキャッチの指定方法と同じ)
    false 縦横サイズの長い方でリサイズ
    true 画像の中心から指定サイズにトリミング

追加した画像サイズの出力

配列で出力

アイキャッチのトリミングを中心以外にする

$crop部分でトリミングの基点を指定することができます。クロップ位置を設定する場合、配列の最初の値はx軸で、2番目の値はy軸です。
x軸には‘left’ ‘center’,  ‘right’が指定可能
y軸には ‘top’, ‘center’,  ‘bottom’が指定可能
どちらもデフォルトはcenter

既にアップ済みの画像をリサイズするにはプラグインで

画像サイズを追加しても、既にアップロードしている画像には適用されません。その場合は「Regenerate Thumbnails」というプラグインを使って一気にリサイズできます。

Regenerate Thumbnails

https://ja.wordpress.org/plugins/regenerate-thumbnails/

シェアする

  • このエントリーをはてなブックマークに追加

フォローする