※ 当サイトではアフィリエイト広告を利用しています。
こんにちは、meiです。
カスタムフィールドで画像フィールドを作成する際、戻り値を画像配列・画像URL・画像IDの3つの中から選べますが、それぞれの出力方法についてまとめてみたいと思います。※ここでは出力するフィールド名を”image_field”としています。
①画像配列
ループ内で出力する場合
<?php $image = get_field('image_field'); if( !empty($image) ): ?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>">
<?php endif;?>
ループ外で出力する場合
<?php $image = get_field('image_field','投稿ID'); if( !empty($image) ): ?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>">
<?php endif;?>
②画像URL
画像URLのみが出力されます。
ループ内で出力する場合
<?php $image_url = get_field('image_field'); if( !empty($image_url ) ): ?>
<img src="<?php echo $image_url ; ?>">
<?php endif; ?>
ループ外で出力する場合
<img src="<?php echo wp_get_attachment_image_url(get_post_meta('投稿ID','image_field',true),'full'); ?>">
wp_get_attachment_image_urlを使って画像のURLを取得します。
サイズは’full’以外にも,thumbnail.small,medium,largeなど、または配列(幅と高さのピクセル値)で指定します。デフォルトではthumbnailになります。
③画像ID
ループ内で出力する場合
<?php $image = get_field('image_field'); if( !empty($image) ): ?>
<?php echo wp_get_attachment_image($image, 'full'); ?>
<?php endif;?>
wp_get_attachment_imageはimgタグを生成して出力します。登録されている場合、altも出力されます。(サイズについては画像URLと同様です。)
ループ外で出力する場合
<?php echo wp_get_attachment_image(get_post_meta('投稿ID','image_field',true),'full'); ?>
まとめ
画像フィールド出力3パターンについてでした。
ループ内の出力の場合ですが、画像配列、または画像IDを選択するとaltも一緒に出力してくれます。必要に応じて使い分けたいですね!