Set the thumbnail size in the ACF gallery

I Use Advanced Custom Fields. This is the code that outputs the gallery.

           <div class="slider-1_wrapp" id="slider1">

                <?php 

                $images = get_field('slider_1_gallery');

                if( $images ): ?>
                    <div class="big_slider">
                        <?php foreach( $images as $image ): ?>
                            <div class="slide">
                                <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
                            </div>
                        <?php endforeach; ?>
                    </div>
                    <div class="miniature_slider">
                        <?php foreach( $images as $image ): ?>
                            <div class="slide">
                                <a href="<?php echo $image['url']; ?>" class="miniature" data-fancybox = "1">
                                    <img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />
                                    <div class="mask">
                                        <i class="icon_1"></i>
                                    </div>
                                </a>
                            </div>                              
                        <?php endforeach; ?>
                    </div>
                <?php endif; ?>

            </div>

As in the line

<img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />

Set thumbnail size? You need to reduce them and crop them according to the layout when loading images of different sizes.

Author: Denis, 2018-10-22

1 answers

In Settings->Media Files, you can set the desired thumbnail size. Out of the box, thumbnail (in your code), medium, large are available. Accordingly, your code for medium will look like this:

<img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />

If you need a different size, you can set it via add_image_size().

add_image_size( 'my-gallery', $width, $height, $crop );

In the code then so:

<img src="<?php echo $image['sizes']['my-gallery']; ?>" alt="<?php echo $image['alt']; ?>" />

Learn more here.

 0
Author: KAGG Design, 2018-10-23 10:06:35