Перейти к содержанию

Image Optimize

Важно

Для премиальных продуктов требуется бесплатный плагин License Manager. Установите его и добавьте лицензию продукта перед установкой этого продукта.

Плагин Image Optimize

Плагин Image Optimize предназначен для Grav CMS и обеспечивает мощную оптимизацию изображений через следующие API:

  • reSmush.it — бесплатный сервис, обеспечивающий достаточную оптимизацию файлов jpg, png и gif. Это сервис по умолчанию, так как для него не нужен ключ API, но он ограничен файлами размером менее 5mb.
  • Tinify — лучший из доступных сейчас сервисов оптимизации с поддержкой файлов jpg, png и webp. Это лучший сервис, но для него требуется ключ API. Есть бесплатный тариф на 500 сжатий в месяц; если вы его превысите, стоимость вполне разумна. Ограничение на файл — 32mb.
  • Kraken.io — надёжный вариант с поддержкой jpg, png и gif. Он уступает Tinify в скорости и возможностях оптимизации. Kraken.io также требует ключ API и предоставляет 100mb сжатия бесплатно, после чего нужно перейти на платный тариф. Тарифы начинаются с $5 в месяц. Ограничение на файл — 32mb.

Установка

Установить плагин Image Optimize можно одним из двух способов. Способ через GPM (менеджер пакетов Grav) позволяет быстро и просто установить плагин одной командой в терминале, а ручной способ — через zip-архив.

Установка через GPM (предпочтительно)

Проще всего установить плагин через менеджер пакетов Grav (GPM), воспользовавшись терминалом системы (его также называют командной строкой). Из корня установки Grav введите:

bin/gpm install image-optimize

Плагин Image Optimize будет установлен в папку /user/plugins внутри Grav. Его файлы находятся в /your/site/grav/user/plugins/image-optimize.

Установка вручную

Чтобы установить плагин, скачайте zip-версию этого репозитория и распакуйте её в /your/site/grav/user/plugins. Затем переименуйте папку в image-optimize. Эти файлы можно найти на GitHub или на GetGrav.org.

Теперь все файлы плагина должны находиться в

/your/site/grav/user/plugins/image-optimize

Примечание

Этот плагин — модульный компонент Grav, для работы которого требуются Grav и Admin.

Конфигурация

Перед настройкой плагина скопируйте user/plugins/image-optimize/image-optimize.yaml в user/config/plugins/image-optimize.yaml и редактируйте только эту копию.

Ниже приведена конфигурация по умолчанию и пояснения к доступным параметрам:

enabled: true                 # Включить плагин
show_thumbs: true             # Показывать миниатюры изображений
service: resmushit            # Сервис оптимизации изображений [resmushit, tinify, kraken]
options:                      # Параметры оптимизации изображений
  exif: false                 # Сохранять данные EXIF
  qlty: 92                    # Качество изображения [0 - 100]. `null` или `100` — без сжатия
tinify:
  api_key:                    # Ключ API Tinify (требуется, только если выбран сервис tinify)
kraken:
  api_key:                    # Ключ API Kraken.io (требуется, только если выбран сервис kraken)
  api_secret:
ignores:                      # Пути, которые нужно игнорировать (формат потока наиболее гибок)
  - user://accounts
  - user://data
  - user://themes
  - plugins://

или через плагин Admin:

![Настройки в админке](settings.png?class=image-shadow)

Использование

После установки проверьте параметры сервиса в Plugins → Image Optimize. По умолчанию используется reSmush.it, так как он не требует ключа API. Однако настоятельно рекомендуется использовать Tinify: он обеспечивает более качественную оптимизацию изображений и поддерживает webp — новый формирующийся веб-формат изображений.

Если вы выберете Tinify или Kraken.io, потребуется указать соответствующие учётные данные API.

![Массовая оптимизация](bulk-optimize.png?class=image-shadow)

Когда настройка завершена, откройте меню Image Optimize в левой боковой панели. Оно покажет все найденные изображения, доступные для оптимизации, а также их текущий размер. Можно оптимизировать каждое изображение отдельно кнопкой compress справа или запустить Bulk Optimize кнопкой вверху.

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

![Сравнение изображений](image-compare.png?class=image-shadow)

Если результат вас не устраивает, нажмите кнопку revert, чтобы отменить оптимизацию и вернуться к предыдущему файлу.

Благодарности

Этот плагин был бы невозможен без API, предоставляемых reSmush.it, Tinify и Kraken.io. Спасибо им за создание этих полезных сервисов.