I am using the ACF Plugin. I want to have a field where I can upload an image, and the result will display the full image in the Lightbox and then then full image will be resized into a thumbnail from that field (like a normal Lightbox).
So far I have the script here, and this is where I am at:
<div class="single last">
<a href="https://wordpress.stackexchange.com/questions/58329/<?php echo the_field("image_gallery'); ?>" rel="lightbox" title="<?php the_title(); ?>">
<?php
$main_car_pic = addslashes(the_repeater_field('image_gallery'));
$reg_ext = "#.jpg#i";
$thumb_ext = "-150x150.jpg";
$car_thumb = preg_replace($reg_ext, $thumb_ext, $main_car_pic);
echo $car_thumb
?>
The ACF Repeater field isn’t working properly and I cannot work why, does anybody have any experience with ACF and resizing images for thumbnails.. Hope what code I have done helps and I’ll be really appreciate it, if nto comment and I can supply anything that might help.
There’s a lot going on here. First off, you should store the repeater field image as an ID (that probably requires changing how the subfield’s setting and possibly re-uploading some of your images) and then use all the WordPress Core API functions to handle it. (You’ll probably cross paths with wp_get_attachment_image_src
.) That gets rid of your regex-ing, makes your image sizing take advantage of add_image_size
, etc.
Second, you need to follow the repeater field’s code example on the page you linked to. get_repeater_field()
returns an object you can iterate through with a loop-like while
statement and get_sub_field()
. (As an aside: get_field( 'a_repeater_field' )
returns an array you can iterate through with a foreach
statement.)
Your final code will look something like this:
<?php if( get_field('image_gallery') ) {
while( the_repeater_field('image_gallery') ) {
$large_img_src = wp_get_attachment_image_src( get_subfield('an_image_subfield'), 'large' );
echo '<a href="' . $large_img_src[0] . '">' . wp_get_attachment_image( get_sub_field('an_image_subfield'), 'thumbnail' ) . '</a>';
}
} ?>
You can replace ‘thumbnail’ and ‘large’ with an array or a custom image size.