ResizeImageGet: быстрое создание превью (ресайз) изображений в Bitrix

ResizeImageGet: быстрое создание превью (ресайз) изображений в Bitrix

Превью — это картинка в небольшом формате, которая весит гораздо меньше оригинала, не уступая ему по качеству. Вес изображения для предпросмотра также сказывается и на «тяжести» самой веб-страницы, что положительно влияет на скорость загрузки сайта. Ранее мы уже рассматривали создание такой копии для CMS WordPress, а сегодня проделаем почти то же с системой Bitrix.

Начать лучше с метода «ResizeImageGet» — с его помощью и будет происходить выполнение ресайза картинок, а именно:

<?php $res_images = CFile::ResizeImageGet($arItem[«PREVIEW_PICTURE»], Array(«width» => ШИРИНА, «height» => ВЫСОТА), BX_RESIZE_IMAGE_EXACT, false); echo ‘<img src=»‘.$res_images[«src»].‘» alt=»‘.$arItem[«NAME»].‘»/>’; ?>

На что здесь смотреть?

Значения ширины и высоты необходимо заменить на желаемые данные будущего превью в пикселях — например, на выходе изображение получится в формате 300х450

Параметр BX_RESIZE_IMAGE_EXACT регулирует принцип масштабирования и имеет несколько активных значений:

  • BX_RESIZE_IMAGE_EXACT — обрезает условно лишние края, но сохраняет пропорции картинки
  • BX_RESIZE_IMAGE_PROPORTIONA — То же самое, но без обрезания лишнего. Размер учитывается на заданных пользователем настройках
  • BX_RESIZE_IMAGE_PROPORTIONAL_ALT — Наиболее лучший вариант для использования ресайза вертикальных картинок. Подгоняет размер относительно установленных значений, сохраняет пропорции с учетом ширины и высоты изображения

False — определяет возвращать ли массив с конечными данными превью, или нет. Соответственно, свойство доступно в двух значениях: False (нет), и True (да)
При использовании указанной выше конструкции ресайз изображений будет выполняться автоматически, а хранятся такие копии в /upload/resize_images/.
Отметим, что код нужно применить в допустимом месте компонента, и проверить «$arItem[«PREVIEW_PICTURE»]» на предмет возврата данных о картинке — делается это через «var_dump»

7
Оставить комментарий

avatar
4 Цепочка комментария
3 Ответы по цепочке
0 Последователи
 
Популярнейший комментарий
Цепочка актуального комментария
  Подписаться  
Уведомление о
Colon Puncher
Colon Puncher

Я читал, что подобные «костыли» только загружают работу системы движка, разве это не так?

admin
admin

Не всегда, данный код не сильно будет грузить вашу систему и CMS. Так как не отправляет запросы к БД.

robtcruce
robtcruce

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

admin
admin

Добрый день, отправьте вашу ошибку нам на почту: admin@seozp.ru , наши программисты постараются помочь решить вашу проблему.

ambeien
ambeien

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

admin
admin

Положительная динамика была всегда.

Смотрите как пример: оригинальный размер картинки 1200х400 (как у нас в полной новости), если вставлять везде подобную картинку, которая весит до 100-1000 кб — это не круто. Так как будет много весит страница, а также будет грузить сильно отправки к БД каждый раз.

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

Да есть минусы, что придется хранить несколько копий одной картинки с разными размерами, но это позволяет быстрее и качественнее показывать пользователю ваши материалы.

Spotif
Spotif

Хорошая статья, как раз искал что-то подобное.

Sergey
7
Sergey
Веб разработчик
Опыт: 4 года
Немного об авторе:
Занимаюсь созданием и поддержкой сайтов. Дорабатываю сайты, поддерживаю серверы. Установка CMS, создание модулей, плагинов.
Услуги: Программирование, создание и поддержка ссайтов