Преимущества модуля:
Не требует сложной настройки и работает сразу после активации
Конвертирует изображения «на лету»
Поддерживает lazyload-изображения (есть возможность задать список собственных атрибутов со ссылками на изображения)
Конвертирует, в том числе, изображения в backgound/background-image, прописанные в html-коде страницы
Работает в режиме композита
Поддерживает внешние CDN (например, Selectel)
- Возвращает оригинальные изображения для браузеров без поддержки .webp
Есть возможность отключить модуль на определенных доменах, разделах или страницах
Поддерживает srcset
Webp - это современный формат изображений, созданный специально для web-ресурсов. Основное преимущество этого формата - меньший вес файла.
Пример:
|
|
Формат: .jpg, размер: 117 Кб | Формат: .webp, размер: 48 Кб |
Гугл официально заявляет, что использование изображений современных форматов (.webp и других) ускоряет загрузку сайта и оказывает положительное влияние на ранжирование сайта в поисковой выдаче. При сканировании сайта инструментом Google Page Speed Insight гугл активно предлагает улучшение “Используйте современные форматы изображений”:
Степень необходимости внедрения современных форматов изображений на своём сайте вы можете узнать, используя инструмент Google Page Speed Insight.
-------------------------------------------------------------------
Ещё полезные модули для ускорения сайта:
Для решения проблемы «Отложите загрузку скрытых изображений» я написал модуль LazyLoad PRO - Отложенная загрузка изображений, видео и iframe в 1 клик, он полностью совместим с модулем Webp - Конвертер изображений в современный формат «на лету».
Если вам требуется решить проблему «Устраните ресурсы, блокирующие отображение», вам может быть интересен другой мой модуль: Предзагрузчик ресурсов
Для решения проблем с уменьшением размера кода HTML, JS, CSS вы можете использовать модуль Минификация HTML/JS/CSS
После установки нужно активировать модуль в настройках.
Настройки модуля доступны по адресу http://ваш_сайт/bitrix/admin/settings.php?lang=ru&mid=delight.webpconverter
Минимальные технические требования:
- наличие на сервере php библиотеки GD v2.2.5 или выше
Библиотека GD входит в список обязательного ПО для Битрикс, но на сервере может быть установлена устаревшая версия, которая некорректно обрабатывает прозрачные .png. В комплект поставки BitrixVM\BitrixENV уже входит актуальная версия.
В случае использования устаревшей версии библиотеки, после установки модуля будет выведено соответствующее уведомление, а модуль переведен в статус "Не активен".
Для корректной работы модуля в файле header.php вашего шаблона должна вызываться стандартная функция
$APPLICATION->ShowHead();
либо её дочерние функции:
$APPLICATION->ShowHeadStrings();
$APPLICATION->ShowHeadScripts();
Особенности работы модуля:
Удаление устаревших изображений (оригиналы которых перестали существовать) производится агентом с периодичностью 1 раз в сутки.
Модуль работает только с изображениями в html-коде страницы (в тегах <img>, стилевых атрибутах background и background-image, а также атрибутах lazyload - data-src и т.п.). Изображения прописанные в .js\.css файлах не конвертируются.
Поддержка старых браузеров реализована следующим образом: при загрузке страницы скрипт на JS проверяет поддерживает ли браузер формат .webp и если не поддерживает, то подменяет ссылки изображений на оригинальные.
Предварительное сжатие изображений jpg/png не требуется, т.к. после конвертирования в .webp изображения выходят оптимизированными. Кроме того, не рекомендуется делать предварительное сжатие, т.к. может пострадать качество изображений при конвертировании в .webp стандартной библиотекой GD (решается установкой на сервер другой библиотеки, например gmagick актуальной версии и очисткой папки /upload/delight.webpconverter/).
Если вам требуется вручную конвертировать локальные изображения, вы можете использовать следующую конструкцию:
if(\Bitrix\Main\Loader::includeModule("delight.webpconverter")){
$originalFilePath = "/upload/path_to_file/file_name.jpg";
$destinationFilePath = DelightWebpConverter::ConvertImage($originalFilePath, $originalFilePath.".webp");
}
|
if(\Bitrix\Main\Loader::includeModule("delight.webpconverter")){
$originalFilePath = "https://cdn.domain.ru/upload/path_to_file/file_name.jpg";
$prepareFilePath = DelightWebpConverter::CONVERTED_IMAGES_FOLDER . str_replace(array("http://", "https://", "//"), "/", $originalFilePath . '.webp');
$destinationFilePath = DelightWebpConverter::ConvertImage($originalFilePath, $prepareFilePath);
} |
if(\Bitrix\Main\Loader::includeModule('delight.webpconverter')){
\DelightWebpConverter::DelightWebpOnEndBufferContentHandler($content);
} |
Корректный html-код при ручном конвертировании изображений с поддержкой всех браузеров выглядит так:
<picture>
<?
$originalFilePath = "/upload/path_to_file/file_name.jpg";
if(\Bitrix\Main\Loader::includeModule("delight.webpconverter")){
$destinationFilePath = DelightWebpConverter::ConvertImage($originalFilePath, $originalFilePath.".webp");
if($destinationFilePath){
// Webp-изображение должно быть определено раньше .jpg/.png
?><source type="image/webp" srcset="<?=str_replace(" ","%20",$destinationFilePath)?>"><?
}
} ?>
<source type="<?=mime_content_type($originalFilePath)?>" srcset="<?=str_replace(" ","%20",$originalFilePath)?>">
<img src="<?=$originalFilePath?>" alt="">
</picture>
|
При обращении за технической поддержкой обязательно указывайте ссылку на сайт и доступы в админку и FTP!
Закажите любой модуль у нас на сайте с бесплатной установкой и гарантией 14 дней
Мы работаем с физическими и юридическими лицами. И предоставляем сразу два варианта оплаты.
- Наличные. Вы подписываете товаросопроводительные документы, расплачиваетесь денежными средствами, получаете товар и чек.
- Безналичный расчет. Принимаем карты Visa и MasterCard. Доступен при курьерской доставке.
Ваш заказ можем доставить собственными ресурсами, при условии вашего нахождения в городе. Либо через 4 варианта доставки:
- Курьерская доставка. Курьерская доставка работает с 9:00 до 19:00. Когда товар поступит на склад, курьерская служба свяжется для уточнения деталей. Специалист предложит выбрать удобное время доставки и уточнит адрес.
- Самовывоз из магазина. Для получения заказа обратитесь к сотруднику в кассовой зоне и назовите номер.
- Сотрудничаем с постаматами. Срок хранения — 3 дня.
- Предоставляем почтовую доставку через почту России. Когда заказ придет в отделение, на ваш адрес придет извещение о посылке. Вскрывать коробку самостоятельно вы можете только после оплаты заказа.
Дополнительная вкладка для размещения информации о товарах, доставке или любого другого важного контента. Поможет вам ответить на интересующие покупателя вопросы и развеять его сомнения в покупке. Используйте её по своему усмотрению.
Вы можете убрать её или вернуть обратно, изменив одну галочку в настройках компонента. Очень удобно.
- Комментарии
- ВКонтакте
