How to use size class in Advanced Custom Fields WP?

Question

I am using Advanced custom fields in my WordPress theme to manage my slider images of Flexslider. I upload the images high quality in the backend, but I only want to show the images with a size of 960px width.

In the documentation is mentioned that the size is stored in the [sizes] array.

https://www.advancedcustomfields.com/resources/gallery/

Does anyone know if the custom sizes that are created in the functions.php file will exist also in the stored array?

And my second question is to get access of a specific size class, should you still use [url] to get the image url or is it automatically stored in the array of sizes?

So is this the correct markup:

<?php foreach( $images as $image ): ?>
    <li>
        <img src="<?php echo $image['url']['sizes']['slider-image']; ?>" alt="<?php echo $image['alt']; ?>">
    </li>
<?php endforeach; ?>

or:

<?php foreach( $images as $image ): ?>
    <li>
        <img src="<?php echo $image['slider-image']; ?>" alt="<?php echo $image['alt']; ?>">
    </li>
<?php endforeach; ?>

Tim Malone Tim Malone · Accepted Answer · 2016-06-18T22:42:20

Yes, the custom sizes you define will be returned in the ['sizes'] array.

The URL for each is returned separately, as the name of the size. For example, if your custom size is called "slider-image", you'll find the URL to the image at ['sizes']['slider-image'].

If you need it, you can also access the dimensions of the image at ['sizes']['slider-image-width'] and['sizes']['slider-image-height'] (this can be useful when the image didn't fit the exact aspect ratio you were expecting, which would mean the smaller axis of the resized image would not exactly match your custom size dimensions).

You may find the PHP function print_r() handy in future for discovering what data is available to you.

How to use size class in Advanced Custom Fields WP?

1 Answers