アイキャッチ画像(Feature Image)のメモ。
アイキャッチを利用するながれ。
1 アイキャッチをサポート(functions.php)
add_theme_support( 'post-thumbnails' );
2 アイキャッチ 基本サイズ指定(functions.php)
set_post_thumbnail_size( $width, $height, $crop ); // --- 1
3 (必要なら)サイズの追加指定(functions.php)
add_image_size( $name, $width, $height, $crop );
例 add_image_size( 'new-thumbnail', 200, 100 ); // --- 2
4 サムネイル表示(テンプレート)
the_post_thumbnail(); // --- 1 基本サイズ表示
// または the_post_thumbnail( 'post-thumbnail' );
the_post_thumbnail( 'new-thumbnail' ); // --- 2 new-thumbnailサイズ表示
WordPressはメディアをアップロードするときに設定 -> メディア -> 画像サイズでで指定したサイズを自動で作成する。
アイキャッチ画像をサポートするとアップロードのとき同時にアイキャッチ画像も作成する。
the_post_thumbnailはアップロードされたすべてのサイズを取得できる
the_post_thumbnail('post-thumbnail'); // set_post_thumbnail_size
the_post_thumbnail('new-thumbnail'); // add_image_size
the_post_thumbnail('thumbnail'); // ダッシュボード [設定] > [メディア]で指定したサムネイル
the_post_thumbnail('medium'); // ダッシュボード [設定] > [メディア]で指定した中サイズ
the_post_thumbnail('large'); // ダッシュボード [設定] > [メディア]で指定した大サイズ
the_post_thumbnail('full'); // フルサイズ
post-thumbnailはアイキャッチで指定したサイズ、thumbnailはメディアの画像サイズで指定したサイズに注意。
No comments yet.
改行と段落タグは自動で挿入されます。
メールアドレスは表示されません。