Изображения в формате webp

cyberkekc · 24 жовтня 2016

Уважаемые, кто-нибудь имел или имеет дело с картинками товаров (и не только) формат webp? С файл менеджером разобрался. Могу загрузить на сервер картинку в этом формате. Но оно не отображается в админке и на сайте. Использую и хром и оперу. Полагаю, нужно править что-то в system/library/image.php и не только там. Кто поможет, кто подскажет? пишет изображение не может быть загружено (выведено на экран)

Змінено 24 жовтня 2016 користувачем cyberkekc

gavi · 26 жовтня 2016

Добрый день, интересный вопрос.

Нужно убедиться, что на вашем хостинге есть поддержка webp. Сохраните в новый файл и покажите вывод.

<?php
var_dump(gd_info());

cyberkekc · 26 жовтня 2016

Добрый, интересный ответ.

Уточнил у хостинга. Ответ таков "Начиная с версии php 5.6 ["WebP Support"]=> bool(true) Т.е. поддерживается.". У меня как раз 5.6.

Кодинг у меня слабо прокачан по сему не понял, что нужно сохранить и вывести. Могу разве что кинуть картинку к какому-нибудь товару и дать ссылку на товар....

gavi · 26 жовтня 2016

Хорошо, на днях как будет больше времени займусь этим, если никто раньше не сделает.

higer · 16 листопада 2017

Тоже интересуюсь данным вопросом, что б все картинки отдавать в формате .webp (OpenCart 2.x)

prochet · 19 січня 2018

Кто-нибудь нашел решение?

kikaridza123 · 20 січня 2018

16 часов назад, prochet сказал:

нашел решение?

В 16.11.2017 в 15:49, higer сказал:

В 26.10.2016 в 17:06, cyberkekc сказал:

Вроде бы это может помочь!

напишите автору, он сможет точно сказать!

prochet · 20 січня 2018

50 минут назад, kikaridza123 сказал:

Вроде бы это может помочь!

напишите автору, он сможет точно сказать!

да я уже прикупил.

SiteMix · 22 січня 2018

В 24.10.2016 в 17:05, cyberkekc сказал:

кто-нибудь имел или имеет дело с картинками товаров (и не только) формат webp?

А не смущает, что кроме Хрома, Оперы и пары мобильных браузеров его ни один браузер не показывает?

Буквально недавно переделывал одному клиенту фоновую картинку в jpg потому что фона не было видно. А главное, размер картинки оказался даже меньше при том же качестве.

prochet · 22 січня 2018

3 часа назад, SiteMix сказал:

А не смущает, что кроме Хрома, Оперы и пары мобильных браузеров его ни один браузер не показывает?

Буквально недавно переделывал одному клиенту фоновую картинку в jpg потому что фона не было видно. А главное, размер картинки оказался даже меньше при том же качестве.

Для этого и сделан принцип выбора отдачи изображения в зависимости от браузера (в модуле от sitecreator)

Всё, все поддерживают, просто не у всех обновления стоят

Змінено 22 січня 2018 користувачем prochet

SiteMix · 23 січня 2018

Просто для общего развития, в чём преимущество этого формата? Зачем вообще эти все танцы с бубном если в итоге файл имеет примерно такой же вес,а для остальных браузеров нужна копия файла в поддерживаемом формате? То есть, вместо одного файла нужно хранить два...

prochet · 23 січня 2018

1 час назад, SiteMix сказал:

Просто для общего развития, в чём преимущество этого формата? Зачем вообще эти все танцы с бубном если в итоге файл имеет примерно такой же вес,а для остальных браузеров нужна копия файла в поддерживаемом формате? То есть, вместо одного файла нужно хранить два...

разница по весу примерно в 2 раза

Спойлер

http://joxi.ru/krDMLgoT0VWkgm

SiteMix · 23 січня 2018

2 часа назад, prochet сказал:

разница по весу примерно в 2 раза

Но ведь приходится держать оба? К тому же, если вместо png сохранить в jpg, то может получиться так:

В 22.01.2018 в 16:40, SiteMix сказал:

переделывал одному клиенту фоновую картинку в jpg потому что фона не было видно. А главное, размер картинки оказался даже меньше при том же качестве.

Если я там запутанно написал, то файл jpg оказался меньше чем webp.

prochet · 23 січня 2018

3 часа назад, SiteMix сказал:

Но ведь приходится держать оба? К тому же, если вместо png сохранить в jpg, то может получиться так:

Если я там запутанно написал, то файл jpg оказался меньше чем webp.

jpg не всегда уместен по фону, а заделывать фон не всегда хочется.

В плане содержания копий - да, но мы не с дискетами ходим =)

sitecreator · 28 лютого 2018

В 23.01.2018 в 14:44, SiteMix сказал:

Просто для общего развития, в чём преимущество этого формата? Зачем вообще эти все танцы с бубном если в итоге файл имеет примерно такой же вес,а для остальных браузеров нужна копия файла в поддерживаемом формате? То есть, вместо одного файла нужно хранить два...

по сравнению с png (с альфа-каналом, т. е. полноценной прозрачностью) у webp преимущество в меньшем размере.

По сравнению с сжатым JPEG (за счет mozjpeg) у webp нет преимущества.

Но создание (сохранение в формате ) webp происходит быстрее чем сжатие средствами mozjpeg.

Обратные стороны webp:

1) необходимость хранить обе копии изображения вместо одной

2) на общем хостинге без модификации движка не обойтись. (на vds не нужно этого делать)

3) не все браузеры понимают webp (предположительно 70% умеют)

4) даже те браузеры, которые знают webp, не умеют пока качественно его масштабировать средствами браузера.

Например, JPEG вы можете растягивать как угодно в сторону уменьшения (в браузере), и при этом качество картинки не уменьшается. С webp пока не очень хорошо все в этом плане - появляется замыленность при масштабировании.

Поэтому, выбор без компромиссов - это сжатие средствами mozjpeg. Отображается сжатое изображение в любом браузере, т. к. это обычный JPEG.

Реализовано сжатие изображений Opencart за счет mozjpeg, optipng, webp в данном модуле:

SiteMix · 19 березня 2019

4 часа назад, dddd сказал:

Что получаем:
1) Все адреса картинок, если браузер поддерживает .webp заменяет на расширение .webp.
2) Если картинки .webp не существует на сервере - в .webp будет сконвертирована картинка с таким же названием, но в формате .png .jpg .gif(если будет найдена) и сохранена в той же папке, где находится оригинальная.

@dddd, неплохой дебют на форуме

Но все правки кроме index.php лучше запихать в OCMOD.

19 березня 2019

Fatal error: Call to undefined function imagewebp() /system/library/image.php on line 72

imagewebp($this->image, $file);

19 березня 2019

стоит 5.6 native

19 березня 2019

17 минут назад, dddd сказал:

Можно phpinfo?

7ochukwu · 23 березня 2019

@dddd

В блоке GD нет webp = enabled, но в списке поддерживаемых форматов imagick есть.

Та же самая ошибка( ocStore 2.3

Змінено 23 березня 2019 користувачем 7ochukwu

OCappLab · 28 березня 2019

В 19.03.2019 в 10:49, dddd сказал:

Не вижу смысла.

Когда начнутся конфликты с другими модулями, использующие эти файлы, возможно и поймёте в чем смысл.

7ochukwu · 28 березня 2019

В 25.03.2019 в 20:52, dddd сказал:

За небольшую плату могу сделать это на imagick.

Это позволит мне загружать изображения webp? объясню в чем сабж, в общем. Для сайта заполняются карточки товаров. Есть изображения - они все в webp. Как сделать так чтобы их перед добавлением не приходилось конвертировать? Решает ли эти задачу?

Alexsoft · 29 березня 2019

Напиши пожалуйста на почту [email protected] необходимо сделать на опенкарт 2.0.3.1 на vds сервере такое чудо с картинками)

СпасибО!

Alexsoft · 29 березня 2019

1 hour ago, dddd said:

Да, могу сделать отдачу тем клиентам, которые не поддерживают webp отдачу другого формата.

Напиши пожалуйста на почту [email protected] необходимо сделать на опенкарт 2.0.3.1 на vds сервере такое чудо с картинками)

СпасибО!

OCappLab · 22 квітня 2019

В 19.03.2019 в 03:54, dddd сказал:

1) Открываем /index.php, после :


<?php

Добавляем:


if (strpos($_SERVER['REQUEST_URI'],'.webp') !== false) {
    $file = pathinfo($_SERVER['REQUEST_URI']);
    $file = __DIR__.$file['dirname'].$file['filename'];
    if (!file_exists($_SERVER['REQUEST_URI'])) {
        if (file_exists($file.'.gif')) {
            $iimage = imagecreatefromgif($file.'.gif');
        } elseif ($file.'.png') {
            $iimage = imagecreatefrompng($file.'.png');
        } elseif ($file.'.jpg') {
            $iimage = imagecreatefromjpeg($file.'.jpg');
        } elseif ($file.'.jpeg') {
            $iimage = imagecreatefromjpeg($file.'.jpeg');
        } 
		if(!$iimage){
			exit('Error: Could not load image ' . $file . '!');
		}
        imagewebp($iimage, __DIR__.$_SERVER['REQUEST_URI']);
        header('Content-type:image/webp');
        imagewebp($iimage);
        die();

    } else {
        exit('Error: Could not load image ' . $file . '!');
    }
}

2) /system/library/response.php Находим:


	public function setOutput($output) {
		$this->output = $output;
	}

Заменяем на


	public function setOutput($output) {
		if( strpos( $_SERVER['HTTP_ACCEPT'], 'image/webp' ) !== false ) {
		    $output = preg_replace('/\b.jpg\b/u', '.webp', $output);
			$output = preg_replace('/\b.png\b/u', '.webp', $output);
			$output = preg_replace('/\b.jpeg\b/u', '.webp', $output);
		}
		$this->output = $output;
	}

3) /system/library/image.php заменяем:


if ($this->mime == 'image/gif') {
				$this->image = imagecreatefromgif($file);
			} elseif ($this->mime == 'image/png') {
				$this->image = imagecreatefrompng($file);
			} elseif ($this->mime == 'image/jpeg') {
				$this->image = imagecreatefromjpeg($file);
			}

На


			if ($this->mime == 'image/gif') {
				$this->image = imagecreatefromgif($file);
			} elseif ($this->mime == 'image/png') {
				$this->image = imagecreatefrompng($file);
			} elseif ($this->mime == 'image/jpeg') {
				$this->image = imagecreatefromjpeg($file);
			} elseif ($this->mime == 'image/webp') {
				$this->image = imagecreatefromwebp($file);
			}

И


		if (is_resource($this->image)) {
			if ($extension == 'jpeg' || $extension == 'jpg') {
				imagejpeg($this->image, $file, $quality);
			} elseif ($extension == 'png') {
				imagepng($this->image, $file);
			} elseif ($extension == 'gif') {
				imagegif($this->image, $file);
			}

На


		if (is_resource($this->image)) {
			if ($extension == 'jpeg' || $extension == 'jpg') {
				imagejpeg($this->image, $file, $quality);
			} elseif ($extension == 'png') {
				imagepng($this->image, $file);
			} elseif ($extension == 'gif') {
				imagegif($this->image, $file);
			} elseif ($extension == 'webp') {
				imagewebp($this->image, $file);
			}

4) /catalog/model/tool/image.php
ПЕРЕД


$image_new = 'cache/' . utf8_substr($filename, 0, utf8_strrpos($filename, '.')) . '-' . (int)$width . 'x' . (int)$height . '.' . $extension;

Добавляем


if( strpos( $_SERVER['HTTP_ACCEPT'], 'image/webp' ) !== false ) {
            $extension = 'webp';
        }

Чтобы получилось так


		$image_old = $filename;
		if( strpos( $_SERVER['HTTP_ACCEPT'], 'image/webp' ) !== false ) {
            $extension = 'webp';
        }
		$image_new = 'cache/' . utf8_substr($filename, 0, utf8_strrpos($filename, '.')) . '-' . (int)$width . 'x' . (int)$height . '.' . $extension;

Что получаем:
1) Все адреса картинок, если браузер поддерживает .webp заменяет на расширение .webp.
2) Если картинки .webp не существует на сервере - в .webp будет сконвертирована картинка с таким же названием, но в формате .png .jpg .gif(если будет найдена) и сохранена в той же папке, где находится оригинальная.

Все файлы и код приведены для версии 2.3.0.2. Для версии 3 могу адаптировать за небольшое вознаграждение.
Так же прикрепил готовые файлы, для версии 2.3.0.2.

На версии php 5.4(centos7) в GD нет поддержки webp.
Потому выполняем команды:


yum install https://dl.fedoraproject.org/pub/epel/epel-release-latest-7.noarch.rpm
yum install http://rpms.remirepo.net/enterprise/remi-release-7.rpm
yum install yum-utils
yum-config-manager --enable remi-php56
yum install php php-mcrypt php-cli php-gd php-curl php-mysql php-ldap php-zip php-fileinfo

webp.zip 3 \u043a\u0411 · 17 downloads

Привел все в вид модификатора, ocmod получился вот такой.

На тестовом своем сайте проверял, все работает.

Все что было добавлено в index.php поместил в header.php.

Проверяйте, тестируйте.

UP: перезалил файл

UP: Работает на OpenCart 2.3, 3.0

UPPP: Возможно решение на Вашем сервере или хостинге не будет работать! УСТАНАВЛИВАТЬ ТОЛЬКО, КАК ТЕСТОВЫЙ ВАРИАНТ!!!

opencart_webp.ocmod.xml

Вхід

Изображения в формате webp

Recommended Posts

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Надіслати

Поділитися на інших сайтах

Створіть аккаунт або увійдіть для коментування

Створити обліковий запис

Вхід

Схожі публікації

Зараз на сторінці 0 користувачів

Покупцям

Розробникам

Корисна інформація

Останні розширення

Important Information