Hi! I don’t know where to find this info. I look at the page for the “update_field”-function, but it doesn’t say how to add an image to an image field. ( update_field )
I know an easy way that works, by adding just the image ID:
$imagefield = 'pagetype1_image'; update_field( $imagefield, 181, $page_id );
..or with the wordpress function:
update_post_meta($page_id, $imagefield, 181);
But I want to be able to add the image path, the alt text, and maybe some css class. But why can’t I even use the image path as the value (instead of the image ID)?
I get the image size and the alt text:
$img = wp_get_attachment_image_src( 181, 'thumbnail'); $img_alttext = get_post_meta(181, '_wp_attachment_image_alt', true);
$img is an array where $img contains the path.
Adding the path doesn’t work:
update_field( $imagefield, $img, $page_id );
So this doesn’t work :
$content = array( 'img'=> $img, //path 'class' => 'hello', 'alt' => $img_alttext ); update_field( $imagefield, $content, $page_id );
How can I make it work?
You are not going to be able to add an image path to an ACF image field. ACF image field like you say, only store the image ID. All of the other information is stored with the image’s attachment post entry an post meta.
To do this you need to insert the image into the media library and then update the ACF field with the ID of the attachment. This is not something that ACF will do for you.
The other information is stored in various places
alt => post meta name _wp_attachment_image_alt
caption => post excerpt
descriptions => post content
title -> post title
Okay, so if I want to add an alt text, I better update the actual image.
But regarding image size, is this specified beforehand on the field? There is a section called “preview size”, I guess that’s where you specify what size is going to be selected? So there is only one set size for each field?
The preview size is only what is show when an image is selected in the admin. You can use any size of the image on the front end for the most part, with the exception of returning the url for the image.
There are tree return values, Image Array, Image URL and Image ID.
If you set the field to return the image URL then the URL returned will be the full size image URL, so you’re locked into this size.
If you return an Image Array then all of the information about the image and all of it’s sizes are returned.
If you return the Image ID then you can use that ID to get any image size you want using standard WP function like
All of these return values and how to use them are covered in the documentation for the image field. http://www.advancedcustomfields.com/resources/image/
I think you’re not understanding. The database, and the field does not contain information about the size of the image. That information is part of the ACF field definition. When you update the field the only thing you’re changing is the attachment ID.
the field is set to return the image object. Here is an example of an image object from something I’m currently working on
Array ( [ID] => 258 [id] => 258 [title] => dragon001 [filename] => dragon001.jpg [url] => /wp-content/uploads/2016/01/dragon001.jpg [alt] => [author] => 1 [description] => [caption] => [name] => dragon001 [date] => 2016-01-01 03:23:19 [modified] => 2016-01-03 18:30:34 [mime_type] => image/jpeg [type] => image [icon] => http://www.ssird5.com.php53-8.dfw1-2.websitetestlink.com/wp-includes/images/media/default.png [width] => 1024 [height] => 768 [sizes] => Array ( [thumbnail] => /wp-content/uploads/2016/01/dragon001-150x150.jpg [thumbnail-width] => 150 [thumbnail-height] => 150 [medium] => /wp-content/uploads/2016/01/dragon001-300x225.jpg [medium-width] => 300 [medium-height] => 225 [medium_large] => /wp-content/uploads/2016/01/dragon001-768x576.jpg [medium_large-width] => 768 [medium_large-height] => 576 [large] => /wp-content/uploads/2016/01/dragon001-1024x768.jpg [large-width] => 1024 [large-height] => 768 [post-thumbnail] => /wp-content/uploads/2016/01/dragon001-500x375.jpg [post-thumbnail-width] => 500 [post-thumbnail-height] => 375 [w-320] => /wp-content/uploads/2016/01/dragon001-320x240.jpg [w-320-width] => 320 [w-320-height] => 240 [w-480] => /wp-content/uploads/2016/01/dragon001-480x360.jpg [w-480-width] => 480 [w-480-height] => 360 [w-640] => /wp-content/uploads/2016/01/dragon001-640x480.jpg [w-640-width] => 640 [w-640-height] => 480 [w-800] => /wp-content/uploads/2016/01/dragon001-800x600.jpg [w-800-width] => 800 [w-800-height] => 600 [w-960] => /wp-content/uploads/2016/01/dragon001-960x720.jpg [w-960-width] => 960 [w-960-height] => 720 [w-1120] => /wp-content/uploads/2016/01/dragon001.jpg [w-1120-width] => 1024 [w-1120-height] => 768 [w-1280] => /wp-content/uploads/2016/01/dragon001.jpg [w-1280-width] => 1024 [w-1280-height] => 768 [w-1440] => /wp-content/uploads/2016/01/dragon001.jpg [w-1440-width] => 1024 [w-1440-height] => 768 [w-1600] => /wp-content/uploads/2016/01/dragon001.jpg [w-1600-width] => 1024 [w-1600-height] => 768 [w-1760] => /wp-content/uploads/2016/01/dragon001.jpg [w-1760-width] => 1024 [w-1760-height] => 768 [w-1920] => /wp-content/uploads/2016/01/dragon001.jpg [w-1920-width] => 1024 [w-1920-height] => 768 [w-2080] => /wp-content/uploads/2016/01/dragon001.jpg [w-2080-width] => 1024 [w-2080-height] => 768 [w-2240] => /wp-content/uploads/2016/01/dragon001.jpg [w-2240-width] => 1024 [w-2240-height] => 768 [w-2400] => /wp-content/uploads/2016/01/dragon001.jpg [w-2400-width] => 1024 [w-2400-height] => 768 ) )
to show the medium image from this on the front end it would look something like
<img src="<?php echo $image['sizes']['medium']; ?>" width="<?php echo $image['sizes']['medium-width']; ?>" height="<?php echo $image['sizes']['medium-height']; ?>" alt="<?php echo $image['alt']; ?>" />
This is explained in the image field documentation http://www.advancedcustomfields.com/resources/image/
So I add the image first with update_field(). And I want to specify the image size of this image in its custom field – do I put the extra code in a page template for each page? Or where do I put it?
I look in the documentation, and on “Customized display (Object)” they first get the image object (I guess for the current page), then it seems they use that object to echo the image somewhere (anywhere). So they are not changing the custom field image, they get the data from it to display it again in some other part of the page (if I didn’t misunderstood it). I want to change the original custom field image that is already added with “update_field”.And it seems that this image is always the full size image.
You must be logged in to reply to this topic.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
© 2023 Advanced Custom Fields.