アイキャッチ変更メモ|プチカスタマイズには必要。位置変更やサイズ変更。 2016年11月21日
アイキャッチ変更メモ|プチカスタマイズには必要。位置変更やサイズ変更。
WordPress
アイキャッチ画像
サイズ変更
該当タグはこれ。
<?php the_post_thumbnail(); ?>
各所にあるこれを見つけて変更することになる。
1)面倒なので出力で調整
2)functionに記述
の2つの方法。
1)面倒なので出力で調整
<?php the_post_thumbnail(array(100, 100)); ?>
むっちゃ簡単。
2)functionに記述
ま、なんかちゃんとやる感じになります。あまりメリットを感じませんが・・・・。
↓
アイキャッチのサイズを変更したい場合は add image sizeという関数。
add image sizeをfunctions.phpに記述。
======
Display posts shortcode というプラグインで、
[display-posts image_size=”medium”・・・]
と指定すると、
幅300 x 高さ300の「medium」サイズの範囲内に画像が縮小されて表示される。
その比率で縮小される。ここの標準はいじらない。
======
functions.php への add image size の記述例
設定画像サイズは必要なものだけにする。書いた分だけサーバに生成されるため。不要な領域を使わない配慮。
//アイキャッチ画像の定義と切り抜き add_action( 'after_setup_theme', 'baw_theme_setup' ); function baw_theme_setup() { add_image_size('small_thumbnail', 90, 90 ,true ); add_image_size('page_eyecatch-image', 615, 115, true ); add_image_size( '150_thumbnail', 150, 75, true ); add_image_size('280_thumbnail', 280, 125, true ); }
アイキャッチ画像名は半角英数字。
単位は、px。省略した状態でOK。
数値は、幅x高さ の順。
幅, 高さ, true とすることで、切り抜き指定(crop)。
切り抜きしたくない場合は、最後の ,true を書かなければ切り抜かれず。
それぞれの指定要素を,カンマで区切る。
==========
設定後は反映するが、それ以前の分は反映されません。
反映の為にRegenerate Thumbnailsプラグインを利用。 https://ja.wordpress.org/plugins/regenerate-thumbnails/
プラグインインストール後にツール→Regen. Thumnails [全てのサムネイルを再生成する]ボタンをクリック。
==========
画像系の登録に問題がなくなったので記述。
<?php the_post_thumbnail('280_thumbnail'); ?>