技術ブログ
WordPressではメディア設定で、サムネイル、中サイズ、大サイズの画像サイズを設定する事が可能です。
オリジナルテンプレートだと3種類の画像サイズ以外にも専用の画像サイズを指定する必要があります。
メディア設定
左メニューの 「設定 > メディア」で設定が可能です。
画像サイズの追加方法
テンプレートのfunction.phpに
add_image_size('●●', 300, 200, true);
を追加します。
- ●●は任意の名前
- 300は横幅(ピクセル)
- 200は縦幅(ピクセル)
- true:指定した大きさでの切り抜き(ハードクロップ)
- false:指定した縦または横の大きさでのリサイズ(ソフトプロポーショナル)
画像の表示方法
<?php the_post_thumbnail( '●●' ); ?>
●●は、add_image_sizeで設定した名前
画像のパスを取得する方法
<?php
$attach_id = get_post_thumbnail_id($post->ID);
$image = wp_get_attachment_image_src($attach_id, '●●');
?>
<img src="<?php echo esc_url($image[0]); ?>" alt="<?php get_the_title(); ?>">
画像のパスを取得する方法(Whileを使用する場合)
<?php
if(have_posts()): while(have_posts()): the_post();
$thumbnail_id = get_post_thumbnail_id($post->ID);
$image = wp_get_attachment_image_src( $thumbnail_id, '●●' );
?>
<?php echo $image[0]; ?>
<?php
endwhile;endif;
?>
●●は、add_image_sizeで設定した名前
大阪のホームページ制作会社TREVOでは、ホームページ制作に関する情報を掲載しています。最短2日で仮サイトを公開するサービスやSEO対策に特化したホームページ制作、オリジナルホームページデザイン、ライティング、リスティング広告、WEBマーケティングなどのサービスをご紹介しています。