Автоматическая оптимизация изображений. Сжатие изображений modx
Автоматическая оптимизация изображений / modx.pro
Что делает данный компонент? Оптимизация изображения для сайта — это уменьшение объема изображения без видимой потери качества. При загрузке файла через файловый менеджер или тв-поле в ресурсе файла изображения (jpg/png), он автоматически его оптимизирует.Что использует? В основе компонента используется api-компонент к сервису TinyPNG, но с небольшими доработками. Бесплатный план api позволяет загружать 500 изображений в месяц, а дальше оплата за каждое изображение (1000 изображений в месяц — 4,5$, 2000 — 13,5$). Без ограничений загрузки в месяц, можно это делать вручную через их сайт, но с ограничениями: размер файла не должен превышать 5MB и не более 20 за раз.
Их API я доработал под второй вариант — имитация ручной загрузки через их сайт. Также Вы можете использовать и обычный вариант с бесплатным/платным api — для этого вам в системных настройках необходимо указать Ваш ключ api в параметре «tinycompressor_api_key». Чтобы вернуться к имитации работы через браузер, указать в этом параметре «crazy».
Насколько эффективно? Во время тестирования использовал тот и другой способ. По результатам: 10мб превратились 700кб.
Планируется ли доработка до ума? Компонент пока находится в beta-версии и сыроват. При наличии времени, чего всегда не хватает, планируется его доработка до следующих возможностей:
- Ресайзинг изображения по умолчанию/заданным параметрам
- Отключение/Включение оптимизации по выбору
- Оптимизация уже загруженных изображений через файловый менеджер
- Сохранения на Amazon S3
Пакет на modstore.ruПроект на GitHub.com
UPD_1: готовый пакет обновлен для работы с minishop2 UPD_2: Обновлена версия пакета, проведена интеграция в phpThumb UPD_3: Обновлена ссылка загрузки для режима имитации UPD_4: Пакет добавлен на modstore.pro UPD_5: Компонент временно отключен до выполнения доработок UPD_6 (10/12/2017): Компонент обновлен до версии 2.0.2-beta.
modx.pro
Image+ MODX Revolution. Кадрирование изображений
Что такое Image+?
Image+ - это расширение Image, входящего в состав MODx работающее с TV. Оно обеспечивает функцию кадрирования изображений при выборе их с помощью интерфейса TV ресурса. Разработчики могут задать ограничение высоты / ширины вместе или по отдельности, а редактор обеспечит обрезку изображения в соответствии с заданными параметрами. URL может быть выдан как в исходном виде, так и отформатированном с помощью использования чанка, позволяющего использовать тэг Alt, title изображения для добавления их к вашим изображениям из области TV.
Системные требования
- MODx Revolution 2.2.x или более поздняя версия
- PHP5 или более поздняя версия
- расширение phpThumbOf
История создания и дополнительная информация.
Image+ написано Аланом Пичем (Alan Pich) в начале 2012 Версия 1.x содержала слишком много ошибок для использования в качестве компонента, поэтому расширение было полностью переписано и в виде версии 2.0 было опубликовано в конце ноября 2012.
Загрузка
Вы можете загрузить ПО с помощью менеджера MODx Revolution, используя Package Management, или из хранилища дополнений MODx.
Использование
Image+ состоит из двух компонентов, вызываемых Image+ : входной и выходной TV . Для корректной работы оба компонента должны быть отмечены как TV. Дополнительные опции для настройки выходных данных быть сконфигурированы в разделе Шаблонных переменных.
Входные опции
Когда Image+ становится выбранным в качестве входного типа для TV, нижеописанные опции становятся доступными:
|
Поле |
Описание |
|
Target Width |
Опциональное ограничение ширины выходного изображения. Если установлено, выходное TV изображение будет точно такой ширины. Может быть использовано вместе с полем Target Height для ограничения размеров изображения. |
|
Target Height |
Опциональное ограничение высоты выходного изображения. Если установлено, выходное TV изображение будет точно такой высоты. Может быть использовано вместе с полем Target Width для ограничения размеров изображения. |
|
Alt tag field |
Если установлено в положение “Yes”, становится доступным дополнительное поле, используемое при редактировании TV для ресурса. Это поле может быть использовано для добавления title или тэга Alt изображению. Используется вместе с выходным чанком (см. ниже Выходные опции) |
Выходные опции
Данные опции носят исключительно вспомогательный характер, но они генерируют и позволяют использовать множество дополнительных опций для изображений. Доступны следующие опции:
Поле | Описание |
Additional phpThumb params | Позволяет вводить дополнительные параметры для передачи в phpThumb и создания изображения. Формат url должен быть таким: (fltr[]=abc&zc=1...) |
Output Chunk | Если поле оставить незаполненным, TV будет выводить исходный url для подготовленного изображения. Есть возможность задать имя чанка для использования определенного выходного формата. О доступных плейсхолдерах будет написано ниже. |
Чанк для выходных данных
Чанк для выходных данных выбирается опционально, он дает доступ к другим плейсхолдерам, позволяющим лучше настроить выходные TV. Доступны следующие плейсхолдеры:
|
Плейсхолдеры |
Описание |
|
[[+url]] |
Url изображения. Значение по умолчанию, если Output Chunk не задан. |
|
[[+width]] |
Ширина выходного изображения (если задана во Входных Опциях) |
|
[[+height]] |
Высота выходного изображения (если задана во Входных Опциях) |
|
[[+alt]] |
Текст для Alt тэга (если задан во Входных Опциях) |
www.modx.cc
[OptiPic] Оптимизация изображений для Google PageSpeed / modx.pro
Представляю дополнение интеграции с сервисом optipic.io
С помощью этого сервиса можно уменьшить размер изображений, выводимых на сайте. Снижение качества изображений в некоторых случаях будет заметно, но зато размер устроит сервис PageSpeed и вы сможете «отвязаться» от сеошников, которые требуют как можно большее количество баллов =)
Сервис OptiPic платный, первые 10 Мб картинок оптимизируются бесплатно, а дальше нужно приобретать пакеты по стоимости от 100 руб.
Стандартный механизм работы сервиса выглядит так:
- Вы загружаете на сайт PHP-скрипт (защищённый секретным ключом)
- Сервис командует этому скрипту пройтись по всем папкам на сайте
- По результатам сканирования составляется список всех картинок на сайте
- Сервис порциями оптимизирует все картинки и загружает к вам на сайт
После этих манипуляций вы можете вызвать сниппет optipic как модификатор.Таким образом на оптимизацию будут отправляться только те файлы, которые вы решите нужным оптимизировать.
<img src="[[+tv.image:optipic]]" alt=""> Оригинальное изображение НЕ будет перезаписано. Сниппет создаст файл в той же папке, с тем же именем, но с префиксом op-Часто на сайте используются сниппеты для создания превьюшек, например, phpthumbon. В таком случае лучше вызывать optipic после таких сниппетов. Тогда, во-первых, оптимизированный файл будет создан внутри папки с превьюшками, а во-вторых, баланс на сервисе будет расходоваться меньше — ведь размер превьюшек гораздо меньше, чем размер оригинала.
<img src="[[+tv.image:phpthumbon=`w=300&h=120&zc=1`:optipic]]" alt=""> Можно ещё немного снизить расходы на сервис, если указать при регистрации купон ILYAUT — тогда у вас будет скидка 10%.
Добавлено в версии 1.1.0-pl
Все файлы перед отправкой на оптимизацию, сжимаются другим сервисом — resmush.it/ Таким образом расходование трафика ещё немного снизится. Этот функционал можно отключить в системных настройках.
Добавлено в версии 1.2.0-pl
Сервис OptiPic ведёт статистику сжатых файлов, но для этого необходимо, чтобы сайт реагировал на команды об индексации файлов.
В версии 1.2.0-pl добавлено ведение журнала обработанных файлов. Таким образом в сервис выгружается статистика (вы можете посмотреть детально, какой файл на сколько килобайт был ужат).
modx.pro
