WordPress
カスタマイズ事例

WORDPRESS CUSTOMIZATION

アドバンストカスタムフィールドを使ってカスタムフィールドに登録した画像の取得と表示

カスタムフィールドをさらに使いやすくしてくれるプラグイン「アドバンストカスタムフィールド」。
どうしてもインストールしておきたいプラグイン10選の記事にも紹介している愛用プラグインです。
 
このプラグインを使ってカスタムフィールドに登録した画像を取得してページに表示する方法のご紹介です。
アドバンストカスタムフィールドでは、管理画面で登録した画像の返り値は「画像オブジェクト」「画像URL」「画像ID」の3択から選ぶことができます。
弊社の場合、imgタグにクラスを付与したいのでいつも「画像ID」で設定してます。
したがって今回は同じく「画像ID」で設定する前提で話を進めます。

画像を取得したいテンプレートphpに以下を追記します。

$attachment_id1 = get_field('prodimg1'); //prodimg1は変数名
$size1 = "full"; // (thumbnail, medium, large, full or custom size)
$image1 = wp_get_attachment_image_src( $attachment_id1, $size1 );

<?php if ($image1){ ?>
	<img src="<?php echo $image1[0]; ?>" class="aligncenter" >
<?php } ?>

これで、aligncenterというクラスを付与して画像タグを貼り付けることができました。

【100ウェブ新着情報メルマガ】

WordPressカスタマイズ事例やウェブ制作ノウハウの新着情報、お役立ち情報を
リアルタイムにメルマガ配信!