WordPress как на ладони
Недорогой хостинг для сайтов на WordPress: wordpress.jino.ru Хостинг, VPS/VDS и отдельные сервера только на SSD дисках. 7 дней бесплатного тестирования.

[РЕШЕНО 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 28 дней назад

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

0
kolshix
452
месяц назад
  • 0

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

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

    kolshix 29 дней назад

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

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

    воспользовался кодом ниже для разграничения вывода .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 28 дней назад

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

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

    kolshix 28 дней назад

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

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