Поддержка Проблемы и решения Вставка изображения пользовательского размера в advanced custom fields (acf)

  • Подскажите. В плагине advanced custom fields есть тип поля изображение и можно выбрать его размер (миниатюра, средний, большой), но как сделать так, что бы на сайте выводился выбранный размер, как не делаю — получается изображение в полном размере.

Просмотр 5 ответов — с 1 по 5 (всего 5)
  • а кто документацию будет читать?

    
    <?php 
    
    $image = get_field('image');
    
    if( !empty($image) ): 
    
    	// vars
    	$url = $image['url'];
    	$title = $image['title'];
    	$alt = $image['alt'];
    	$caption = $image['caption'];
    
    	// thumbnail
    	$size = 'thumbnail';
    	$thumb = $image['sizes'][ $size ];
    	$width = $image['sizes'][ $size . '-width' ];
    	$height = $image['sizes'][ $size . '-height' ];
    
    	if( $caption ): ?>
    
    		<div class="wp-caption">
    
    	<?php endif; ?>
    
    	<a href="<?php echo $url; ?>" title="<?php echo $title; ?>">
    
    		<img src="<?php echo $thumb; ?>" alt="<?php echo $alt; ?>" width="<?php echo $width; ?>" height="<?php echo $height; ?>" />
    
    	</a>
    
    	<?php if( $caption ): ?>
    
    			<p class="wp-caption-text"><?php echo $caption; ?></p>
    
    		</div>
    
    	<?php endif; ?>
    
    <?php endif; ?>
    

    нужная строка — $size = 'thumbnail'; — здесь можно и свой собственный размер указать.

    Нужно весь фрагмент кода вставлять?
    А в пункте «возвращение значения» выбирать «массив изображения?»
    рис.1

    И не подскажите, там можно как то делать, что б изображение было обернуто ссылкой, что б при клике на уменьшенную картинку открывалось полное изображение?

    Модератор Denis Yanchevskiy

    (@denisco)

    WordPress-разработчик, denisco.pro

    Нужно весь фрагмент кода вставлять?

    Вам нужно использовать либо вариант из документации, либо на основе него сделать реализацию для своего сайта.

    А в пункте «возвращение значения» выбирать «массив изображения?»

    Да.

    что б изображение было обернуто ссылкой, что б при клике на уменьшенную картинку открывалось полное изображение?

    Это уже есть в примере, который Вам написал Flector

    <a href="<?php echo $url; ?>" title="<?php echo $title; ?>">
    
    		<img src="<?php echo $thumb; ?>" alt="<?php echo $alt; ?>" width="<?php echo $width; ?>" height="<?php echo $height; ?>" />
    
    	</a>

    Изображение не отображается. Может я что то делаю не так?
    Есть тип поля «Повторитель», называется our-works, в него вложены другие поля, одно из которых поле с изображением work-img, там стоит тип поля изображение и выбран «Возвращаемое значение — массив изображения».
    имг1
    Содержимое файла, который выводит поле следующее:

    <?php if( have_rows('our-works', 'option')) : ?>
    <section class="wrapper-container">
        <section class="our-works ">
            <div class="page-block-title">Наши работы</div>
            <ul class="our-works__list clearfix">
                <?php while( have_rows('our-works', 'option') ): the_row(); ?>
                    <li>
                        <div class="our-works__client">
                            <?php 
    
                            $image = get_field('work-img');
    
                            if( !empty($image) ): 
    
                                // vars
                                $url = $image['url'];
                                $title = $image['title'];
                                $alt = $image['alt'];
                                $caption = $image['caption'];
    
                                // thumbnail
                                $size = 'thumbnail';
                                $thumb = $image['sizes'][ $size ];
                                $width = $image['sizes'][ $size . '-width' ];
                                $height = $image['sizes'][ $size . '-height' ];
    
                                if( $caption ): ?>
    
                                    <div class="wp-caption">
    
                                <?php endif; ?>
    
                                <a href="<?php echo $url; ?>" title="<?php echo $title; ?>">
    
                                    <img src="<?php echo $thumb; ?>" alt="<?php echo $alt; ?>" width="<?php echo $width; ?>" height="<?php echo $height; ?>" />
    
                                </a>
    
                                <?php if( $caption ): ?>
    
                                        <p class="wp-caption-text"><?php echo $caption; ?></p>
    
                                    </div>
    
                                <?php endif; ?>
    
                            <?php endif; ?>
    
                            <div class="our-works__date"><?php the_sub_field('work-date') ?></div>
                            <div class="our-works__name"><?php the_sub_field('work-name') ?></div>
                            <div class="our-works__desc"><?php the_sub_field('work-desc') ?></div>
                        </div>
                        <div class="our-works__card"><?php the_sub_field('text') ?></div>
                    </li>
                <?php endwhile; ?>
            </ul>
        </section>
    </section>
    <?php endif; ?>

    Подскажите что не так?

Просмотр 5 ответов — с 1 по 5 (всего 5)
  • Тема «Вставка изображения пользовательского размера в advanced custom fields (acf)» закрыта для новых ответов.