Reply To: Image Array

• Keith Lock

• September 14, 2017 at 9:33 pm

Hi Russell,

Ok, so if you are returning the ID only, then you can use a built in WordPress function to auto-generate the Image HTML for you.

As a side benefit to doing it this way, the auto-generated code will also be “responsive” – meaning that when someone is viewing your web site, their device will load an image that is appropriate for their device (in terms of file size, etc). Because… WordPress generates multiple-sized images each time you upload.

At any rate… since you are only storing the Image ID, that’s all you will see if doing:

<?php
echo get_field('image');
?>

or:

<?php
the_field('image');
?>

But, since you want the actual image to be generated… you can use the wp_get_attachment_image() WordPress function. If you tell it the Image ID it will display the HTML (i.e. the image will show up). By default, it will just show a ‘thumbnail’. If you want to use a different size, you tell it the size you want (either by name or dimensions). You can learn more about your options here, which makes reference to cropping, etc.

Below in an example where it specifies a size by name. There are built in sizes in WordPress, plus themes and plugins may also generate different names to create images of different dimensions/orientations. I like to use this plugin so that when I am viewing an image in the WordPress Medial Library, I get to see a list of all available image sizes currently in use.

Ok, finally, below is the example (assuming again that your field name is ‘image’).
Note: The example below is pulled direct from this resource. It’s worth a read to wrap your mind around the ACF Image field.

<?php 

$image = get_field('image');
$size = 'full'; // (thumbnail, medium, large, full or custom size)

if( $image ) {

	echo wp_get_attachment_image( $image, $size );

}

?>