MODX

RezImgCrop 1.0-beta4 для Revolution и Evolution

RezImgCrop 1.0-beta4 для Revolution и Evolution

Почти в каждом проекте мы сталкиваемся с одним и тем-же — дизайн.

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

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

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

Что умеет Фильтр RezImgCrop?

  1. создаёт ресайз изображения.
  2. создаёт обрезку изображения.

Хочу отметить, что мы стараемся не искажать изображения, а уменьшать и обрезать!

Пример вызова фильтра RezImgCrop.

Создаём TV — Тип ввода: Изображения, Тип вывода: Текст

Допустим у нас есть новости, и я хочу, что-бы на странице кратких новостей, была привью картинки размером 150x75px, а в самой статье максимальная ширина 250px (высоту я не захотел в данном примере трогать, для того чтобы отобразить полную картинку).

Допустим TV у нас называется -tvimages

1) В чанге вывода кратких новостей, где выводим изображения вставляем

<img src="[[*tvimages:rezimgcrop =`r-150x,c-150x75`]]" width="150" height="75" />

2) В шаблоне самих новостей, перед *content мы вставляем следующий код

<img src="[[*tvimages:rezimgcrop =`r-250x`]]" width="150" height="75" />

Параметры:

r — ресайз изображения,

c — кроп (обрезка) изображения,

Соответствено параметры размера изображения 

WxH — w = width, H = height (in pixels),

Если мы параметр один упускаем, то ставим «0» или не указываем. В данном примере r-250x — мы сделали ресайз по ширине.

Примеры:

[[*tv.images:rezimgcrop = `r-150x,c-150x75`]] — ресайз по ширине и обрезка

[[*tv.images:rezimgcrop = `r-150x,c-150x75,g-`]] — ресайз по ширине, обрезка и преоброзование в серый.

[[*tv.images:rezimgcrop = `r-150`]] — ресайз max 150px

[[*tv.images:rezimgcrop = `min-150`]] — ресайз min 150px

[[*tv.images:rezimgcrop = `min-150`]] — ресайз min 150px

[[*tv.images:rezimgcrop = `r-150x,c-150x150`]] — квадрат 150х150рх

[[*tv.images:rezimgcrop = `r-150x0`]] — ресайз по ширине

[[*tv.images:rezimgcrop = `r-0x75`]] — ресайз по высоте

[[*tv.images:rezimgcrop = `r-x75`]] — ресайз по высоте

[[*tv.images:rezimgcrop = `r-150x75`]]- в этом случае, если указать два параметра, изображения будет не пропорциональное. Лучше упускать параметр высоты и применять Crop.

Через запятую мы можем указывать параметры, т.е. r — ресай потом с-кроп или наоборот.

Revo

Для того чтобы применит не как фильтр, то можно вызвать через снипет, запрос выглядет следующим образом;

[[!rezimgcrop? &input=`/ckfinder/userfiles/images/news/pic001.jpg` &options=`r-150x0,c-150x75`]]

Evo

Для того чтобы применит не как фильтр, то можно вызвать через снипет, запрос выглядет следующим образом;

[!rezimgcrop? &input=`/ckfinder/userfiles/images/news/pic001.jpg` &options=`r-150x0,c-150x75`!]

скачать пакет можно с официального сайта MODX 

Для Evo скачиваем архив здесь, установка в файле read


Надеюсь продолжения будет.

Обновления RezImgCrop 1.0-beta4 

— Нет необходимости указывать абсолютный или относительный путь изображения.

— Добавлена функция преобразования изображения в оттенок серого, просто добавьте «g-»


Valentin Rasulov

4 Комментария

Burnos Vladimir # 2015-10-12 19:52:59
Доброго дня, Валентин! Очень хочется узнать, есть ли планы развивать старый добрый rezimgcrop?
Много есть расширений для этих целей, но статичные файлы превьюшек многократно лучше постоянно очищаемого кеша.
Ждать ли новых версий?
Valentin Rasulov Автор # 2015-10-12 20:06:41
Владимир добрый день. Честно говоря, на данный момент не думал его обновлять. Если будет время, то постараюсь обновить, а точнее переписать логику (есть задумки) после Нового года (январь ориентировочно), но не буду обещать. Просто на данный момент, я модекс почти не использую.
Burnos Vladimir # 2015-10-12 20:31:45
Поскольку я MODx использую, считаю, что мне пассивно проявлять в данном вопросе свою заинтересованность неуместно. Я мог бы что то запланировать для материальной поддержки развития этого полезного снипета. Мои пожелания: улучшить сжатие и качество превьюшек. Добавить возможность работы с водяными знаками (watermark).
Отдельно, было бы интересно добавить наложение текста из поля (например, longtitle) поверх изображения. Это очень актуально, так как перепосты в соцсети частая необходимость, а там иллюстрация лучше воздействует на аудиторию будучи подписанной именно как совмещенное с текстом изображение.
пример:https://meduza.io/image/share_images/15949.png
(видимо о подобной задаче речь тут:https://modxclub.ru/topics/phpthumb/modphpthumb-nalozhenie-teksta-na-izobrazhenie-1894.html#comment-7808)
Valentin Rasulov Автор # 2015-10-12 20:43:04
Спасибо, постараюсь учесть.
Чтобы оставить комментарий необходимо авторизоваться