WordPress как на ладони
Недорогой хостинг для сайтов на WordPress: wordpress.jino.ru

[РЕШЕНО 99%] Работа с .webp — как сохранить прозрачность ??

как сохранить прозрачность с PNG в WEBP (Альфаканал) ??
[Проверил на другом сервере , прозрачность работает, в чем проблема не могу знать]
[Конечный результат в примере 3]

WP с .webp - дружит кое как, он только загружает картинки и всего, не обрабатывает, не меняет размеры, не создает миниатюры. Посмотрел уровень сжатия .webp, и мне очень понравилось, особенно мне важна прозрачность, мне нужно избавится от грамостких .PNG - вот и посмотрел в сторону этого формата.

пример

// 
add_filter('wp_generate_attachment_metadata', 'custom_crop');

function custom_crop($metadata) {

	$uploads = wp_upload_dir();
	$file = path_join( $uploads['basedir'], $metadata['file'] ); // original image file
	list( $year, $month ) = explode( '/', $metadata['file'] );
	$target = path_join( $uploads['basedir'], "{$year}/{$month}/".$metadata['sizes']['medium']['file'] ); // intermediate size file
	$image = imagecreatefromjpeg($file); // original image resource
	$image_target = wp_imagecreatetruecolor( 44, 44 ); // blank image to fill
	imagecopyresampled($image_target, $image, 0, 0, 25, 15, 44, 44, 170, 170); // crop original
	imagejpeg($image_target, $target, apply_filters( 'jpeg_quality', 90, 'image_resize' )); // write cropped to file

	return $metadata;
}

Решение:
1 Проверка конвертации:
не работает imagewebp() у меня на версии 5.3, на 5.6 работает.
2 Создал пример для создания миниатюр

Пример 1 создание дубля оригинала

add_filter('wp_generate_attachment_metadata', 'custom_webp_thumb');

function custom_webp_thumb($metadata) {
	// получение имени картинки и полного серверного пути 
	$uploads = wp_upload_dir();
	$file = path_join( $uploads['basedir'], $metadata['file'] ); // original image file
	$image=  imagecreatefromjpeg($file);

	// Save the image 
	//       (картинка,полный путь для сохранения, качество) 
	imagewebp($image, '/home/admin/web/');

	return $metadata;
}

Пример 2 создание миниатюры

add_filter('wp_generate_attachment_metadata', 'custom_webp_thumb');

function custom_webp_thumb($metadata) {
	// Create a blank image and add some text
	$uploads = wp_upload_dir();                  // серверная папка загрузок
	$path_parts  = pathinfo($metadata['file']);  // промежуточные папки по годам и месяцам ($path_parts['dirname']) = 2018/10

	$file = path_join( $uploads['basedir'], $path_parts['dirname'].'/'. $metadata["sizes"]["medium"]["file"] ); // original image file
	$image = imagecreatefrompng($file); // или imagecreatefromjpeg

	// Save the image
	imagewebp($image, '/home/ih208296/nuje.ru/wp-content/uploads/2018/10/'.$metadata["sizes"]["medium"]["file"].'.webp');
	// unlink($file);

	return $metadata;
}

Пример 3 - Конвертация только для PNG и размера медиум

add_filter('wp_generate_attachment_metadata', 'custom_webp_thumb');

function custom_webp_thumb($metadata) {
	$mime_type = $metadata["sizes"]["medium"]["mime-type"];
	if ( $mime_type == "image/png" ){
		// Получаем серверный путь и путь к файлу 
		$uploads = wp_upload_dir();                  // серверная папка загрузок
		$path_parts  = pathinfo($metadata['file']);  // промежуточные папки по годам и месяцам ($path_parts['dirname']) = 2018/10

		$file = path_join( $uploads['basedir'], $path_parts['dirname'].'/'. $metadata["sizes"]["medium"]["file"] ); // original image file
		$image = imagecreatefrompng($file); // или imagecreatefromjpeg
		imagepalettetotruecolor($image);
		imagealphablending($image, false);
		imagesavealpha($image, true);

		// Корректировка имен и сохранение 
		$new_webp_image = preg_replace("/\.png$/", ".webp", $metadata["sizes"]["medium"]["file"]);      
		imagewebp($image, $uploads['basedir'].'/'. $path_parts['dirname'].'/'. $new_webp_image);

		$metadata["sizes"]["medium_webp"] = Array(
									"file" => $new_webp_image,
									"width" => $metadata["sizes"]["medium"]["file"]["width"],   
									"height" => $metadata["sizes"]["medium"]["file"]["height"], 
									"mime-type" => "image/svg+xml"
								); 
	//  unlink($file);      // удалить оригинальную миниатюру   
		// проверка переменных 
	//  $q= serialize($uploads['basedir']. $path_parts['dirname'].'/'. $new_webp_image);     
	//  file_put_contents(  '/home/admin/web/****.com/public_html/wp-content/uploads/2018/' . '_convert_image', $q);
	}

	return $metadata;
}

проверка и вывод на странице

$thumb_id = get_post_thumbnail_id($post->ID);
$metadata = wp_get_attachment_metadata($thumb_id);    
if ( isset( $metadata['sizes']['medium_webp'] ){
  .... 
}
Заметки к вопросу:
Kama 1.8 года назад

Да у этого формата просто потрясающе маленький размер. И пока неполная поддержка. Тема интересная держи в курсе smile

0
kolshix
1.9 года назад 619
  • 0

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

    И еще тут http://php.net/manual/ru/function.imagewebp.php видно что это функция модуля GD так что он должен быть установлен на сервере.

    kolshix 1.8 года назад

    Нет смысла особо

    Для меня это спасение для этой страницы

    воспользовался кодом ниже для разграничения вывода .WEBP или .PNG

    <?php
      $user_agent = $_SERVER["HTTP_USER_AGENT"];
      if (strpos($user_agent, "Firefox") !== false) $browser = "Firefox";
      elseif (strpos($user_agent, "Opera") !== false) $browser = "Opera";
      elseif (strpos($user_agent, "Chrome") !== false) $browser = "Chrome";
      elseif (strpos($user_agent, "MSIE") !== false) $browser = "Internet Explorer";
      elseif (strpos($user_agent, "Safari") !== false) $browser = "Safari";
      else $browser = "Неизвестный";
      echo "Ваш браузер: $browser";
    ?>
    Kama 1.8 года назад

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

    Подробнее (caniuse)

    kolshix 1.8 года назад

    ну с гуглом трудно состязаться , особенно если ещё идея формата отличная:

    • Великолепное сжатие
    • Небольшие потери в качестве при сжатии
    • Альфаканал
    • поддержка передовых браузеров
    Комментировать
На вопросы могут отвечать только зарегистрированные пользователи. Вход . Регистрация