Как управлять размером изображений в Wordpress?

Помогите, пожалуйста, с размером картинок, выводимых с помощью wp_get_attachment_image

Вывожу картинку 2304х1080 через Advanced Custom Fields:

<div class="hero-img">
    <?php 
        $image = get_field('hero-img');
        $size = 'full';
        if( $image ) {
            echo wp_get_attachment_image( $image, $size );
        };
    ?>
</div>

Контейнер:

.hero-img {
  width: 100%;
  max-width: 1152px;
}

Таким образом, выводится картинка, которая подгоняется по ширине контейнера, а высота рассчитывается исходя из пропорции оригинала. В моём случае высота выводимой картинки 540px.

Проблемы начинаются тогда, когда я хочу управлять высотой картинки. Например, на планшете ширина контейнера картинки 768px, высота, соответственно, 360px. Предположим, что на телефоне я хочу увеличить высоту картинки, и увеличиваю:

.hero-img img {
  width: 100%;
  height: 540px;
}

Но, на выходе получаю мыльную картинку. Проблема в том, что wp_get_attachment_image тянет высоту текущей версии картинки, которая подгоняется по ширине экрана (контейнера) пропорционально оригиналу, а нужно, чтобы размер рассчитывался от оригинала, учитывая необходимую мне высоту.

Можно ли это полечить?


Ответы (1 шт):

Автор решения: KodimWeb
.hero-img img {
  max-width: 100%;
  height: auto;
}

или

 wp_get_attachment_image_url()
→ Ссылка