【WPプラグイン】Advanced Custom Fieldの画像表示のソースコード

2014年8月26日

Advanced Custom Fieldで作成したカスタムフィールドに画像を追加したとき、
その画像を任意のサイズで使いたい時のソースコードを自分用にメモ。

沢山のカスタムフィールドを使って画像を登録した時、コードが長くなってしまうので、
カスタムフィールドで画像フィールド作るときには、それを見越して作った方が良さげです…。
と言いつつ、現場での登録を楽にさせることを考えるとどうしても増えるのですが（悩）。

画像を表示するとき

まずこれ大事！フィールド作成時に、返り値を画像IDにすること！

<?php
//画像のIDを取得
$img_id=get_field('フィールド名');

//functions.phpに記述した画像サイズ取得
$size_m = "medium";

//画像の表示用データ取得（この時の返り値はURL,幅,高さの順に配列）
$img_m = wp_get_attachment_image_src ( $img_id , $size_m ) ;

//タイトル、altなど取得
$img_ttlalt = get_post ( get_field ('フィールド名') ) ;

//alt（代替テキスト）の取得
$img_alt = get_post_meta ( $img_ttlalt -> ID , '_wp_attachment_image_alt' , true );

//タイトルの取得
$img_ttl = $img_ttlalt -> post_title ;
?>

//ここから表示用HTML
<a href="<?php echo wp_get_attachment_url ( get_field ('フィールド名' , $post -> ID) ); ?>"
   title="<?php echo $img_title ; ?>" >
<img src = "<?php echo $img_m[0] ; ?>"
     width = "<?php echo $img_m[1] ; ?>"
     height = "<?php echo $img_m[2] ; ?>"
     alt = "<?php echo $img_alt ; ?>" >
</a>