Просмотров: 51543
Встала задачка: на собственном сайте, уменьшить размер превьюшек картинок у анонсов раздела дизайн. Само собой, перезаливать все картинки и лень и долго и глупо. Можно воспользоваться стандартной функцией битрикс CFile::ResizeImage и изменить размеры картинок на лету.

Для того, чтобы отресайзерить уже загруженные изображения в нужном месте шаблона компонента, вставляем:
$renderImage = CFile::ResizeImageGet(
$arItem["PREVIEW_PICTURE"],
Array("width" => НОВАЯ_ШИРИНА, "height" => НОВАЯ_ВЫСОТА),
BX_RESIZE_IMAGE_EXACT, false
);
echo '<img alt="'.$arItem["NAME"].'" src="'.$renderImage["src"].'" />';
Параметры масштабирования и обрезки можно установить такими переменными:
- BX_RESIZE_IMAGE_EXACT - масштабирует в прямоугольник $arSize c сохранением пропорций, обрезая лишнее (в примере выше именно оно);
- BX_RESIZE_IMAGE_PROPORTIONAL - масштабирует с сохранением пропорций, размер ограничивается $arSize;
- BX_RESIZE_IMAGE_PROPORTIONAL_ALT - масштабирует с сохранением пропорций за ширину при этом принимается максимальное значение из высоты/ширины, размер ограничивается $arSize, улучшенная обработка вертикальных картинок.
В итоге новые, отресайзенные картинки попадут в папку /upload/resize_images и сами применятся в шаблоне.
Параметры метода CFile::ResizeImageGet:
array CFile::ResizeImageGet(
mixed file,
array arSize,
const resizeType = BX_RESIZE_IMAGE_PROPORTIONAL,
bool bInitSizes = false,
array arFilters = false,
bool bImmediate = false,
bool jpgQuality = false
);
- file Идентификатор файла из таблицы b_file или массив описания файла (Array(FILE_NAME, SUBDIR, WIDTH, HEIGHT, CONTENT_TYPE)), полученный методом GetFileArray.
- Size Массив в виде Array("width"=>WIDTH, "height"=>HEIGHT) со значениями ширины и высоты для уменьшаемой картинки. Оба ключа обязательны.
- resizeType Тип масштабирования:
- InitSizes Флаг возвращения в результирующем массив размеров измененной картинки. True - возвращает, false - нет
- Filters Массив массивов для постобработки картинки с помощью фильтров: array(array("name" => "sharpen", "precision" => 15)). Фильтров пока один - sharpen. Задавать его не обязательно - будет инициализирован автоматом. Используется для наведения резкости у миниатюр.
- Immediate Флаг передается в обработчик события OnBeforeResizeImage, по смыслу означает масштабирование непосредственно при вызове метода. Обработчик в принципе может выполнять отложенное масштабирование.
- jpgQuality Число, устанавливающее в процентах качество JPG при масштабировании. Чем больше значение, тем выше качество и больше размер файла изображения.
Все комментарии:
Оставить комментарий

Михаил Базаров 26.03.2016
Цитата |
---|
Александр написал: Здравствуйте Михаил! а есть у Вас решение сделать в bitrix увеличить фото по клику, как на официальном сайте bitrix http://www.1c-bitrix.ru/products/cms/index.php С уважением |
Артур 04.08.2016
А подскажите как убрать ресайз картинок у товаров в корзине??
что только не пробовал..
в корзине путь к картинки идет - /upload/resize_cache/iblock/e72/110_110_1/e725ae01607c4b21b1 4ffec17cc92c26.jpg
в детальной карточке - /upload/iblock/e7b/e7bc22e91cd29476877ec0137f9adc0d.jpg - нет /resize_cache/
нужно сделать везде как в карточки.
что только не пробовал..
в корзине путь к картинки идет - /upload/resize_cache/iblock/e72/110_110_1/e725ae01607c4b21b1
в детальной карточке - /upload/iblock/e7b/e7bc22e91cd29476877ec0137f9adc0d.jpg - нет /resize_cache/
нужно сделать везде как в карточки.
Борис Лобода 22.04.2017
Михаил, подскажите, как поменять название папки в которую resizer картинки кладет, например /300_250_ или /400_300_. Проблема возникает с блокировщиками рекламы, в правилах фильтрации изображений у них присутствуют такого вида папки. Может какой-то другой выход есть?
almix 30.11.2017
Здравствуйте, Михаил, создание превью изображений этой функцией. Но получаемые превью оказываются с артефактами - белый цвет иногда заменяется соседним f4f4f4, из-за этого картинка становится неяркой.
Но любые изменения в её параметрах не влияют на итог, думаю дело в работе gd. Нашёл такой вариант решения - http://mithrandir.ru/professional/php/gd-resizing-artefacts-fix.html, но может в битриксе есть настройки для этого?
Код |
---|
$arFile = CFile::GetFileArray($arItem['PREVIEW_PICTURE']['ID']; $imgWidth = $imgHeight = 260; $arrImage = CFile::ResizeImageGet( $arFile, array("width" => $imgWidth, "height" => $imgHeight), BX_RESIZE_IMAGE_EXACT, true, array("name" => "sharpen", "precision" => 100),//array(),//$arFilter false, 100 ); |
Макс Терещенко 30.03.2018
Добрый день
Если используется эта функция имеет смысл использовать сервис Optipic ?
Если используется эта функция имеет смысл использовать сервис Optipic ?

Михаил Базаров 30.03.2018
Цитата |
---|
Макс Терещенко написал: Добрый день Если используется эта функция имеет смысл использовать сервис Optipic ? |
Но я от сервиса отказался, он мне визуально много картинок подпортил.
Алексей Клёнин 24.10.2018
Добрый день.
Столкнулся со следующей проблемой.
Есть задача вывести несколько изображений в детальной новости. Для этого дела используем fotorama.
Так как изображений несколько, чтобы страница быстрее грузилась, мы для изображений делаем миниатюры. Делаются миниатюры с помощью Битрикс'овой функции ResizeImageGet.
Всё почти-что здорово работает, но иногда на некоторых страницах при первой загрузке выводится вместо первой большой картинки на весь экран, маленькая. Отресайзенная (оу щит, сори за такой слэнг) до размеров которые мы задали ранее. Хотя по логике должна выводится большая и далее миниатюры.
Что я делаю не так?
Вот, код всего этого действа
Столкнулся со следующей проблемой.
Есть задача вывести несколько изображений в детальной новости. Для этого дела используем fotorama.
Так как изображений несколько, чтобы страница быстрее грузилась, мы для изображений делаем миниатюры. Делаются миниатюры с помощью Битрикс'овой функции ResizeImageGet.
Всё почти-что здорово работает, но иногда на некоторых страницах при первой загрузке выводится вместо первой большой картинки на весь экран, маленькая. Отресайзенная (оу щит, сори за такой слэнг) до размеров которые мы задали ранее. Хотя по логике должна выводится большая и далее миниатюры.
Что я делаю не так?
Вот, код всего этого действа
Код |
---|
<div class="col-12 p-0 fotorama" data-nav="thumbs" data-thumbwidth="250" data-thumbheight="141" data-allowfullscreen="true"> <? // additional photos if(count($arResult["MORE_PHOTO"])>0):?> <?foreach($arResult["MORE_PHOTO"] as $PHOTO):?> <? $file = CFile::ResizeImageGet($PHOTO, array('width'=>'250', 'height'=>'141'), BX_RESIZE_IMAGE_EXACT, true); ?> <a href="<?=$PHOTO["SRC"]?>"> <img border="0" src="<?=$file["src"]?>" alt="<?=$arResult["NAME"]?>" title="<?=$arResult["NAME"]?>" /> </a> <?endforeach?> <?endif?> </div> |

Михаил Базаров 24.10.2018
Цитата |
---|
Алексей Клёнин написал: Добрый день. Столкнулся со следующей проблемой. Всё почти-что здорово работает, но иногда на некоторых страницах при первой загрузке выводится вместо первой большой картинки на весь экран, маленькая. Отресайзенная (оу щит, сори за такой слэнг) до размеров которые мы задали ранее. Хотя по логике должна выводится большая и далее миниатюры. |

Александр Коваленко 06.11.2019
Получается при уменьшении картинки на лету имея входное изображение 1.jpg при вызове ресайза создастся 2.jpg и покажет его. Тут все класс. А как насчет кеширования заресайзенных картинок связь 1.jpg и 2.jpg где-то сохраняется? Или же при обновлении страницы опять таки из базы приходит ссылка на 1.jpg уменьшение на лету делает из нее 3.jpg такую же как и 2.jpg и отображает уже новую превьюшку. И так получается после каждого обновления будут создаваться новые картинки, а старые, такие же, просто неконтролируемо заполнять место на сервере.

Михаил Базаров 07.11.2019
Цитата |
---|
Александр Коваленко написал: И так получается после каждого обновления будут создаваться новые картинки, а старые, такие же, просто неконтролируемо заполнять место на сервере. |
Если обновится исходная, то создастся новая копия. Старые удалятся если сбросите кеш сайта.