Brand new instance of WP version 5.7.1, 2021 theme latest update, ACF Pro 5.9.5 added, simple image field added. I believe this also applies to the free version of ACF, the image field.
if( function_exists('acf_add_local_field_group') ):
acf_add_local_field_group(array(
'key' => 'group_6086a8b40acd5',
'title' => 'Responsive Picture',
'fields' => array(
array(
'key' => 'field_6086a8c93f65f',
'label' => 'Responsive Picture',
'name' => 'responsive_picture',
'type' => 'image',
'instructions' => '',
'required' => 0,
'conditional_logic' => 0,
'wrapper' => array(
'width' => '',
'class' => '',
'id' => '',
),
'return_format' => 'array',
'preview_size' => 'medium',
'library' => 'all',
'min_width' => '',
'min_height' => '',
'min_size' => '',
'max_width' => '',
'max_height' => '',
'max_size' => '',
'mime_types' => '',
),
),
'location' => array(
array(
array(
'param' => 'post_type',
'operator' => '==',
'value' => 'post',
),
),
array(
array(
'param' => 'post_type',
'operator' => '==',
'value' => 'page',
),
),
),
'menu_order' => 0,
'position' => 'normal',
'style' => 'default',
'label_placement' => 'top',
'instruction_placement' => 'label',
'hide_on_screen' => '',
'active' => true,
'description' => '',
));
endif;On a simple page, page-responsive-picture.php under theme root I have this PHP code.
<?php
echo 'Respsonive Picture Page';
function dump( $mixed = null ) {
echo '<pre>';
var_export( $mixed );
echo '</pre>';
return null;
}
$acf_fields = get_fields();
dump( $acf_fields );
$acf_image_array = $acf_fields['responsive_picture'];
dump( $acf_image_array );
$file = wp_get_attachment_metadata( '45' );
dump( $file );The output of that is this.
array (
'responsive_picture' =>
array (
0 =>
array (
'responsive_picture' =>
array (
'ID' => 45,
'id' => 45,
'title' => 'Nasa_Space_10',
'filename' => 'Nasa_Space_10.jpg',
'filesize' => 7241307,
'url' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'link' => 'https://acfimgfield.loc/index.php/responsive-picture/nasa_space_10/',
'alt' => '',
'author' => '1',
'description' => '',
'caption' => '',
'name' => 'nasa_space_10',
'status' => 'inherit',
'uploaded_to' => 8,
'date' => '2021-04-29 12:09:11',
'modified' => '2021-04-29 12:10:00',
'menu_order' => 0,
'mime_type' => 'image/jpeg',
'type' => 'image',
'subtype' => 'jpeg',
'icon' => 'https://acfimgfield.loc/wp-includes/images/media/default.png',
'width' => 8000,
'height' => 8000,
'sizes' =>
array (
'thumbnail' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'thumbnail-width' => 150,
'thumbnail-height' => 150,
'medium' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'medium-width' => 300,
'medium-height' => 300,
'medium_large' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'medium_large-width' => 750,
'medium_large-height' => 750,
'large' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'large-width' => 750,
'large-height' => 750,
'1536x1536' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'1536x1536-width' => 1536,
'1536x1536-height' => 1536,
'2048x2048' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'2048x2048-width' => 2048,
'2048x2048-height' => 2048,
900 => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'900-width' => 900,
'900-height' => 900,
525 => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'525-width' => 525,
'525-height' => 525,
180 => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'180-width' => 180,
'180-height' => 180,
),
),
),
),
)
array (
0 =>
array (
'responsive_picture' =>
array (
'ID' => 45,
'id' => 45,
'title' => 'Nasa_Space_10',
'filename' => 'Nasa_Space_10.jpg',
'filesize' => 7241307,
'url' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'link' => 'https://acfimgfield.loc/index.php/responsive-picture/nasa_space_10/',
'alt' => '',
'author' => '1',
'description' => '',
'caption' => '',
'name' => 'nasa_space_10',
'status' => 'inherit',
'uploaded_to' => 8,
'date' => '2021-04-29 12:09:11',
'modified' => '2021-04-29 12:10:00',
'menu_order' => 0,
'mime_type' => 'image/jpeg',
'type' => 'image',
'subtype' => 'jpeg',
'icon' => 'https://acfimgfield.loc/wp-includes/images/media/default.png',
'width' => 8000,
'height' => 8000,
'sizes' =>
array (
'thumbnail' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'thumbnail-width' => 150,
'thumbnail-height' => 150,
'medium' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'medium-width' => 300,
'medium-height' => 300,
'medium_large' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'medium_large-width' => 750,
'medium_large-height' => 750,
'large' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'large-width' => 750,
'large-height' => 750,
'1536x1536' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'1536x1536-width' => 1536,
'1536x1536-height' => 1536,
'2048x2048' => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'2048x2048-width' => 2048,
'2048x2048-height' => 2048,
900 => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'900-width' => 900,
'900-height' => 900,
525 => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'525-width' => 525,
'525-height' => 525,
180 => 'https://acfimgfield.loc/wp-content/uploads/2021/04/Nasa_Space_10.jpg',
'180-width' => 180,
'180-height' => 180,
),
),
),
)
array (
'width' => 8000,
'height' => 8000,
'file' => '2021/04/Nasa_Space_10.jpg',
'sizes' =>
array (
0 =>
array (
'file' => 'Nasa_Space_10-900x900.jpg',
'width' => 900,
'height' => 900,
'mime-type' => 'image/jpeg',
),
1 =>
array (
'file' => 'Nasa_Space_10-525x525.jpg',
'width' => 525,
'height' => 525,
'mime-type' => 'image/jpeg',
),
2 =>
array (
'file' => 'Nasa_Space_10-180x180.jpg',
'width' => 180,
'height' => 180,
'mime-type' => 'image/jpeg',
),
),
'image_meta' =>
array (
'aperture' => '0',
'credit' => '',
'camera' => '',
'caption' => '',
'created_timestamp' => '0',
'copyright' => '',
'focal_length' => '0',
'iso' => '0',
'shutter_speed' => '0',
'title' => '',
'orientation' => '0',
'keywords' =>
array (
),
),
)Any of the extra sizes added to function twenty_twenty_one_setup() {} and called with add_action( 'after_setup_theme', 'twenty_twenty_one_setup' ); are not updated in the ACF image array.
The sizes I have added are the following.
add_image_size( '900', 900, 0 );
add_image_size( '525', 525, 0 );
add_image_size( '180', 180, 0 );
Result.
The ACF image field does not seem to update the ACF image array with the correct file names and file paths for the created sizes.
This happens regardless of where the image has been uploaded, through the native Media Lib or through the ACF image field itself.
The WP metadata for the file shows the sizes array where file names and file paths are 100% correct.
$file_metadata = wp_get_attachment_metadata( $file_id );
Only when using the ACF image field the created ACF Image Array does not show the correct file paths and file names in its sizes sub-array.
This is tested on the http://devilbox.org/ stack, with PHP 7.4.13 as well as PHP 8. The WP install is untouched/fresh 5.7.1 with the untouched fresh 2021 theme, with just the above sizes and an image field added to a test page. Checking the Uploads folder the sizes have been created correctly by WP and are in the there.
Welcome
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Forums
Helping Others
Helping others is a great way to earn karma, gain badges and help ACF development!