Сжатие изображений в WordPress встроенной функцией

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

Зачем сжимать изображения в WordPress штатными функциями

Сжатие изображений в WordPress с помощью следующей функции позволяет генерировать страницу меньших размеров. Соответственно, такая страница быстрее загружается в браузере пользователя.  Кроме того, известно, что некоторые внешние PHP скрипты позволяют злоумышленникам внедрять в сайт вредоносные файлы и причинять ущерб. Поэтому мы рекомендуем использовать именно штатные функции WordPress в целях сохранения безопасности сайта.

Функция для сжатия изображений на Вордпресс сайте

Следующий PHP код необходимо добавить в файл вашей темы functions.php. Это функция для сжатия изображений на Вордпресс сайте, которые были загружены с библиотеку встроенными в движок средствами:

function WP_img_resize( $url, $width, $height = null, $crop = null, $single = true ) {
        if(!$url OR !$width ) return false;
 
        $upload_info = wp_upload_dir();
        $upload_dir = $upload_info['basedir'];
        $upload_url = $upload_info['baseurl'];
 
        if(strpos( $url, $upload_url ) === false) return false;
 
        $rel_path = str_replace( $upload_url, '', $url);
        $img_path = $upload_dir . $rel_path;
 
        if( !file_exists($img_path) OR !getimagesize($img_path) ) return false;
 
        $info = pathinfo($img_path);
        $ext = $info['extension'];
        list($orig_w,$orig_h) = getimagesize($img_path);
 
        $dims = image_resize_dimensions($orig_w, $orig_h, $width, $height, $crop);
        $dst_w = $dims[4];
        $dst_h = $dims[5];
 
        $suffix = "{$dst_w}x{$dst_h}";
        $dst_rel_path = str_replace( '.'.$ext, '', $rel_path);
        $destfilename = "{$upload_dir}{$dst_rel_path}-{$suffix}.{$ext}";
 
        if(!$dst_h) {
                $img_url = $url;
                $dst_w = $orig_w;
                $dst_h = $orig_h;
        } elseif(file_exists($destfilename) && getimagesize($destfilename)) {
                $img_url = "{$upload_url}{$dst_rel_path}-{$suffix}.{$ext}";
        } else {
                $resized_img_path = image_resize( $img_path, $width, $height, $crop );
                if(!is_wp_error($resized_img_path)) {
                        $resized_rel_path = str_replace( $upload_dir, '', $resized_img_path);
                        $img_url = $upload_url . $resized_rel_path;
                } else {
                        return false;
                }
        }
        if($single) {
                $image = $img_url;
        } else {
                $image = array (
                        0 => $img_url,
                        1 => $dst_w,
                        2 => $dst_h
                );
        }
 
        return $image;
}

Как получать сжатые изображения с помощью Вордпресс функции

Чтобы получить сжатое изображение вам необходимо знать его URL адрес, и указать нужные размеры на выходе.

<img src="<?php echo WP_img_resize($url, $width, $height, $crop); ?>" />
  • $url - путь до изображения на вашем сервере
  • $width - необходимая ширина изображения
  • $height - необходимая высота изображения
  • $crop - логическое значение. Если $crop = 1, то изображение будет обрезано точно по размерам. Если $crop = 0, то размер изображение будет отредактирован по большей стороне.

Пример

Предположим, что нам необходимо получить все изображения прикрепленные к посту, сжать их до размера 100х100 пикселей и вывести на странице этого поста.

Для этого мы воспользуемся следующим кодом:

$gallery = get_attached_media( 'image', $post->ID );
    if($gallery) {
        $image_string ='';
        foreach ( $gallery as $attachment_id => $image) {  
            $image_url_array = wp_get_attachment_image_src($attachment_id, 'full'); 
            $url = $image_url_array[0];
            $image_src = WP_img_resize($url, 100, 100, 1);
            $image_string .= '<img src="'.$image_src.'" />';
        }

        echo $image_string;
    }

Это самый простой пример, который показывает, как сжимать изображения в WordPress встроенными функциями.

Если у вас остались вопросы по этой теме, пишите в комментариях, постараемся ответить.